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

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

مثال بالصور

هذه الأزرار




تكبير الصورةتصغير الصورة تم تعديل ابعاد هذه الصورة. انقر هنا لمعاينتها بأبعادها الأصلية.

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


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




تكبير الصورةتصغير الصورة تم تعديل ابعاد هذه الصورة. انقر هنا لمعاينتها بأبعادها الأصلية.

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



تكبير الصورةتصغير الصورة تم تعديل ابعاد هذه الصورة. انقر هنا لمعاينتها بأبعادها الأصلية.

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



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

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

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







تكبير الصورةتصغير الصورة تم تعديل ابعاد هذه الصورة. انقر هنا لمعاينتها بأبعادها الأصلية.

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


الكود للأعلى

الكود: ---------تضليل المحتوى

.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;
}



كود تحيرك لآسفل


الكود: ---------تضليل المحتوى
.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;
}





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


ارجوا ان اكون افدتكم
انتهي الموضوع

تسلمى للكود المميز

شكراً الك
جاري التجريب

شكرا للكود

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