Gönderen Konu: SMF 2.1 EKSTRA ŞIK BİR MENÜ v2 - CSS3-HTML5 uyumlu !  (Okunma sayısı 1536 defa)

0 Üye ve 1 Ziyaretçi konuyu incelemekte.

Çevrimdışı anti-imha

  • Yeni Üye
  • *
  • İleti: 6
  • Saygınlık Puanı: 0
  • www.SmfMod.com
  • Web Siteniz: http://localhost
Çok söze gerek yok can sıkıntısı bir ara yapmıştım.. Bayram hediyesi olsun diye paylaştım.. Default tema ile tamamen uyumludur. İsteyen admin paneli uyumlu yapabilir ben uğraşmak istemedim...Örnek ektedir.

İndex.template.php aç:

Bul

Kod: [Seç]
    echo '
    <div id="header">
        <div class="frame">
            <h1 class="forumtitle">
                <a id="top" href="', $scripturl, '">', empty($context['header_logo_url_html_safe']) ? $context['forum_name_html_safe'] : '<img src="' . $context['header_logo_url_html_safe'] . '" alt="' . $context['forum_name_html_safe'] . '">', '</a>
            </h1>';

    echo '
            ', empty($settings['site_slogan']) ? '<img id="smflogo" src="' . $settings['images_url'] . '/smflogo.png" alt="Simple Machines Forum" title="Simple Machines Forum">' : '<div id="siteslogan" class="floatright">' . $settings['site_slogan'] . '</div>', '';


Değiştir

Kod: [Seç]
    echo '
    <div id="header">
        <div class="frame">

            ', empty($settings['site_slogan']) ? '<img id="smflogo" src="' . $settings['images_url'] . '/smflogo.png" alt="Simple Machines Forum" title="Simple Machines Forum">' : '<div id="siteslogan" class="floatleft">' . $settings['site_slogan'] . '</div>', '';


    echo '
<NAV>
<UL>
  <LI><A href="#">ANASAYFA</A></LI>
  <LI><A href="#">FORUM</A>
  <UL>
    <LI><A href="#">ARAMA</A></LI>
    <LI><A href="#">UYELER</A></LI>
    <LI><A href="#">KULLANICI PANELi</A>
    <UL>
      <LI><A href="#">HTML</A></LI>
      <LI><A href="#">CSS</A></LI></UL></LI></UL></LI>
     
  <LI><A href="#">iNDiRME</A>
  <UL>
    <LI><A href="#">SMF</A></LI>
    <LI><A href="#">VBULLETIN</A></LI></UL></LI>
  <LI><A href="#">KiSiLESTiRME</A></LI>
    <LI><A href="#">DESTEK</A></LI>
   <LI><A href="#">HAKKINDA</A></LI>
  </UL></NAV>';

İndex.css aç:

Ekle:

Kod: [Seç]
nav {
        margin: 16px 0 0 0; text-align: center;    float: right;    padding-right: 2px;font-size: 12px;
}
nav ul ul {
    display: none;
}
nav ul li:hover > ul {
    display: block;
}
nav ul {
        background: #FFFFFF;
    background-image: linear-gradient(to bottom, #FFFFFF 0%, #E2E9F3 70%); list-style: none; padding: 0px 20px; border-radius: 8px; display: inline-table; position: relative; box-shadow: 0px 0px 9px rgba(0,0,0,0.15);border:1px solid #ccc;
-webkit-box-shadow: 0 0 0 2px white, 0 6px 4px black;
-moz-box-shadow: 0 0 0 2px white, 0 6px 4px black;
box-shadow: 0 0 0 2px white, 0 6px 4px black;
}
nav ul::after {
    clear: both; display: block; content: "";
}
nav ul li {
    float: left;    font-weight: bold;border-radius: 3px;
}
nav ul li:hover {
    background: #ffa500;    font-weight: bold;
}
nav ul li:hover a {
color: #333;
}
nav ul li a {
    padding: 10px 20px; color: rgb(117, 117, 117); text-decoration: none; display: block;
}
nav ul ul {text-align: left;
    background: #f0f4f7; padding: 0px; border-bottom-left-radius: 3px;border-bottom-right-radius: 3px;border-top-left-radius: 0;border-top-right-radius: 0; top: 100%; position: absolute;    float: left;
-webkit-box-shadow: 0 0 0 2px white, 0 6px 4px black;
-moz-box-shadow: 0 0 0 2px white, 0 6px 4px black;
box-shadow: 0 0 0 2px white, 0 6px 4px black;
}
nav ul ul li {
 float: none; position: relative; border-bottom: 1px solid #ccc;border-top: 1px solid #fff;
}
nav ul ul li a {
    padding: 0px 0x;
}
nav ul ul li a:hover {
    background: #e4e4e4;
}
nav ul ul ul {
    left: 100%; top: 0px; position: absolute;
}

Logonun da efektli olmasını istiyorsanız (Menünün yanında güzel oluyor bence .... ) İndex.css'de

Bul:

Kod: [Seç]
/* Float these items to the right */
#siteslogan, img#smflogo {
    margin: 0;
    padding-right: 2px;
    float: right;
    line-height: 50px;
    font-size: 1.8em;
}

Değiştir:

Kod: [Seç]
/* Float these items to the right */
#siteslogan, img#smflogo {
    margin: 0;
    padding-right: 2px;
    float: left;
    line-height: 50px;
    font-size: 1.8em;
}
/* Tweak the SMF logo */

  @keyframes slideDown {
   0% {
      transform: translateY(-100%);
   }
   50%{
      transform: translateY(8%);
   }
   65%{
      transform: translateY(-4%);
   }
   80%{
      transform: translateY(4%);
   }
   95%{
      transform: translateY(-2%);
   }       
   100% {
      transform: translateY(0%);
   }     
}

@-webkit-keyframes slideDown {
   0% {
      -webkit-transform: translateY(-100%);
   }
   50%{
      -webkit-transform: translateY(8%);
   }
   65%{
      -webkit-transform: translateY(-4%);
   }
   80%{
      -webkit-transform: translateY(4%);
   }
   95%{
      -webkit-transform: translateY(-2%);
   }       
   100% {
      -webkit-transform: translateY(0%);
   } 
}


img#smflogo
{
 animation-name: slideDown;
   -webkit-animation-name: slideDown; 

   animation-duration: 1s; 
   -webkit-animation-duration: 1s;

   animation-timing-function: ease; 
   -webkit-animation-timing-function: ease; 
    margin: 16px 0 0 0;
   visibility: visible !important; 
  }


v2'de:
Gölgelndirme eklendi
Ovalleme yapıldı
Renk uyumu sağlandı
« Son Düzenleme: 19 Temmuz 2015, 18:36:29 Gönderen: anti-imha »

 

bodrum escort - escort bodrum - escort kayseri - malatya escort - escort bayan bodrum - Didim Escort Bayan - Escort Bayan Fethiye