كود لجعل ازرار التصفح مثل ازرار منتدى الدعم

كود لجعل ازرار التصفح مثل ازرار منتدى الدعم

السلام عليكم ورحمة الله وبركاته
اخواني اعضاء وزوار
اقدم لكم كود تومبيلات + css لجعل ازرار التصفح كأزرار منتدى الدعم

صوره للازرار بعد تريكب الكود


[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]

وبعد مرور الماوس عليها


[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]


وعند وصول رساله جديده


[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]


اولا للنسخه الثانيه
لوحة الاداره - مظهر المنتدى - التومبيلات والقوالب - اداراه عامه
ثم ابحث في قالب overall_header

ثم ابحث عن الكود التالي

الكود:

</td>
                  <!-- BEGIN switch_logo_right -->
                  <td><a href="{U_INDEX}"><img  src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1"  /></a></td>
                  <!-- END switch_logo_right -->
              </tr>
            </table>

            <table cellspacing="0" cellpadding="0" border="0" align="{MENU_POSITION}">
              <tr>
                  <td align="{MENU_POSITION}"{MENU_NOWRAP}>{GENERATED_NAV_BAR}</td>
              </tr>
            </table>

            <div style="clear: both;"></div>

واستبدله بالكود التالي

ثم ضع الكود التالي بورقة css

الكود:

 a.mainmenu {  color:#FFF;  font-size:11px;  text-shadow:1px  1px 2px #000;  -webkit-transition:400m

وضع الكود التالي بالجافا واختر جميع الصفحات

ويمكنك اختيار الخلفيه للازرار والتحكم الكامل بها من كود الcss

اما النسخه الثالثه
لا يحتاج الى اي خطوه من الخطوات اعلاه

كل ماعليك وضع الكود التالي في ورقة css

الكود:

ul.navlinks a.mainmenu {
  -moz-transition-duration: 500ms;
  -o-transition-duration: 500ms;
  -webkit-transition-duration: 500ms;
  transition-duration: 500ms;
  color: white;
  font-size: 15px;
  outline: none;
  text-shadow: 1px 1px 2px black;
 
}

ul.navlinks a.mainmenu:hover {
 text-shadow: 1px 1px 10px;
 font-size: 16px;
  font-weight: bold;
  color: #FFFF71;
}

ul.navlinks {
    background: url('http://2img.net/i/fa/fdf3/bg_cat.png') repeat-x #1675BC;
    border-radius: 0 0 7px 7px;
    -moz-border-radius: 0 0 7px 7px;
    -o-border-radius: 0 0 7px 7px;
    -webkit-border-radius: 0 0 7px 7px;
    border-top: 1px solid white;
    bottom: 9px;
    position: relative;
    text-align: center;
    height: 40px;
}

ul.navlinks span.new-message {
    transform:rotate(-4deg);
    -ms-transform:rotate(-4deg);
    -moz-transform:rotate(-4deg);
    -webkit-transform:rotate(-4deg);
    -o-transform:rotate(-4deg);
    background: url("http://2img.net/i/fa/email.gif") no-repeat scroll right top transparent;
    color: #FFCC00;
    padding-right: 2em;
}

ويمكنك اختيار الخلفيه والتحكم الكامل بالازرار من كود الcss


ومبروك عليك الكود
والله يوفق الجميع يارب

روووووووووووعة