کد رنگی شدن اسکرول بار

[☻ IMAN ☺ 42]

سلام...

همون طور که از عنوان تاپیک معلومه کدی میخوام که رنگ اسکرول بار رو تغییر بده... اگه کد سی اس اس باشه بهتره!

[reazah 255]

مرورگرهال webkit

/*----------------scrollbar---------*/
::-webkit-scrollbar {background:#FFFFFF; height:1px; width:10px;}
::-webkit-scrollbar-thumb {background:#0099dd; border-radius:; box-shadow:;}
::-webkit-scrollbar-corner { background:#000; }
::-webkit-scrollbar-thumb:hover{background:#FF9900; border-radius:; box-shadow:;}

[☻ IMAN ☺ 42]

برای مرورگرهای فایرفاکس و اکسپلور از چه کدی استفاده کنم؟

آخه وقتی webkit رو به moz یا ms تغییر میدم عمل نمیکنه!

[alireza1375 892]

تا آنجا که می دانم این امکان برای بقیه مرورگر ها وجود ندارد.

[Mohammad 1620]

تست کنید:

SCROLLBAR-FACE-COLOR: red; SCROLLBAR-HIGHLIGHT-COLOR: gray; 
SCROLLBAR-SHADOW-COLOR: black; SCROLLBAR-ARROW-COLOR: gray; 
SCROLLBAR-TRACK-COLOR: black; SCROLLBAR-DARKSHADOW-COLOR: red

[reazah 255]

برای iIEلعنتی

body{
scrollbar-base-color: #C0C0C0;
scrollbar-base-color: #C0C0C0;
scrollbar-3dlight-color: #C0C0C0;
scrollbar-highlight-color: #C0C0C0;
scrollbar-track-color: #EBEBEB;
scrollbar-arrow-color: black;
scrollbar-shadow-color: #C0C0C0;
scrollbar-dark-shadow-color: #C0C0C0;
}

برای کروم باحال

::-webkit-scrollbar { width: 3px; height: 3px;}
::-webkit-scrollbar-button { background-color: #666; }
::-webkit-scrollbar-track { background-color: #999;}
::-webkit-scrollbar-track-piece { background-color: #ffffff;}
::-webkit-scrollbar-thumb { height: 50px; background-color: #666; border-radius: 3px;}
::-webkit-scrollbar-corner { background-color: #999;}}
::-webkit-resizer { background-color: #666;}

برای فایر فاکس

@-moz-document url-prefix(http://),url-prefix(https://) {
scrollbar {
-moz-appearance: none !important;
background: rgb(0,255,0) !important;
}
thumb,scrollbarbutton {
-moz-appearance: none !important;
background-color: rgb(0,0,255) !important;
}
thumb:hover,scrollbarbutton:hover {
-moz-appearance: none !important;
background-color: rgb(255,0,0) !important;
}
scrollbarbutton
{
display: none !important;
}
scrollbar[orient="vertical"] {
min-width: 15px !important;
}
}

ویرایش شده شهریور 92 توسط reazah

[imanfakhar 26231]

نکته : استفاده از منابع این کار بالاست و برای سایتهای وردپرسی توصیه نمی شه

مگر اینکه سرور قوی و مناسب داشته باشید