ปรับแต่ง scroll bar ให้สวย
ปรับแต่ง scroll bar ให้สวย<font size="3" style="font-family: 'Comic Sans MS'; line-height: 1.5;"><style type="text/css" media="screen">
::-webkit-scrollbar {width: 8px; height:3px; }
::-webkit-scrollbar {
width: 7px;
height: 3px;
}
::-webkit-scrollbar-track-piece {
background-color: #FFFFFF;
-webkit-border-radius: 5px;
}
::-webkit-scrollbar-thumb:horizontal, ::-webkit-scrollbar-thumb:vertical {
width: 5px;
background-color: #ff9d00;
-webkit-border-radius: 10px;
}
::-webkit-scrollbar-thumb:horizontal:hover, ::-webkit-scrollbar-thumb:vertical:hover {
background-color: #ff9d00;
}
::-moz-selection {
background: #ff9d00;color:#FFFFFF;
}
::selection {
background: #ff9d00;color:#FFFFFF;
}</font>
เปลี่ยนสีโค๊ดปรับสีปรับขนาดได้ตามโค๊ด
นำโค๊ดนี้ใส่ที่ไฟล์ extend_common.css หรือ header.htm ส่วนบนของเทมเพลทที่ใช้
ทดสอบแล้วใช้ได้ในหลายเทมเพลท หลายเวอร์ชัน
ตัวอย่าง 3.2 http://rst.in.th/forum.php
แก้ๆใส่ผิด
<style type="text/css" media="screen">
::-webkit-scrollbar {width: 8px; height:3px; }
::-webkit-scrollbar {
width: 7px;
height: 3px;
}
::-webkit-scrollbar-track-piece {
background-color: #FFFFFF;
-webkit-border-radius: 5px;
}
::-webkit-scrollbar-thumb:horizontal, ::-webkit-scrollbar-thumb:vertical {
width: 5px;
background-color: #ff9d00;
-webkit-border-radius: 10px;
}
::-webkit-scrollbar-thumb:horizontal:hover, ::-webkit-scrollbar-thumb:vertical:hover {
background-color: #ff9d00;
}
::-moz-selection {
background: #ff9d00;color:#FFFFFF;
}
::selection {
background: #ff9d00;color:#FFFFFF;
}
</style> ผมยังไม่เข้าใจเลยครับ scroll bar มันดูตรงส่วนไหนหรอครับ {:31_1198:} load1part ตอบกลับเมื่อ 2014-10-11 21:42
ผมยังไม่เข้าใจเลยครับ scroll bar มันดูตรงส่วนไหนหรอครับ
แถบเลื่อน ขวาสุดไงครับ ขอบคุณมากมายครับ
หน้า:
[1]