كود css لتحريك أزرار التصفح عند مرور الماوس

من طرف **KhaliD MallaH** الثلاثاء أبريل 12, 2011 9:17 pm

[b]كود يقوم بتحريك أزرار التصفح عند مرور الماوس

يعمل على جميع النسخ

مثال بالصور

هذه الأزرار

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

وعند مرور الماوس على أحدها
يتحرك هكذا

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

طريقة الوضع : -

الكود يوضع بورقة الــــcss

لوحة الادارة > مظهر المنتدي > الوان > ورقة تصميم الـcss

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

الكود التحريك الى الاعلى
ضع رد لكي ترى الكود

<table align="center" border="0" cellpadding="0" cellspacing="1" width="90%"><tr><td>الرمز:</td></tr><tr><td class="code">
.mainmenu {
display:inline-block;
height:37px;
overflow:hidden;
vertical-align: top;
/* для корректного отображения в старых браузерах */
display:-moz-inline-stack;
zoom:1;
*display:inline;
_overflow:hidden;
}
a.mainmenu img {
margin-top:0px;
}
a.mainmenu img:hover{
margin-top:-37px;
}
</td></tr></table>

كود تحيرك لآسفل
ضع رد لكي ترى الكود

<table align="center" border="0" cellpadding="0" cellspacing="1" width="90%"><tr><td>الرمز:</td></tr><tr><td class="code"></td></tr></table>

لتقليل المسافة التى يتحركها الزر
يمكنك التعديل على الرقم اللى بالكود
وهو 37
وأجعله ما تريد

ارجوا ان اكون افدتكم[/b]