1
条回答
写回答
写回答
-
社区爱好者，专为云栖社区服务！官网示例代码：
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>jQuery UI Slider - Default functionality</title> <link rel="stylesheet" href="//code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css"> <script src="//code.jquery.com/jquery-1.10.2.js"></script> <script src="//code.jquery.com/ui/1.11.0/jquery-ui.js"></script> <link rel="stylesheet" href="/resources/demos/style.css"> <script> $(function() { $( "#slider" ).slider(); }); </script> </head> <body> <div id="slider"></div> </body> </html> 原来滑块颜色为灰色： 在jQuery代码应用$("#slider").slider();方法之后，实际生成的代码： <body> <div id="slider" class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all"> <span class="ui-slider-handle ui-state-default ui-corner-all" tabindex="0" style="left: 0%;"></span> </div> </body>其实那个灰色块是图片，注意对应的CSS代码：
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border: 1px solid #d3d3d3; background: #e6e6e6 url("images/ui-bg_glass_75_e6e6e6_1x400.png") 50% 50% repeat-x; font-weight: normal; color: #555555; }如果要修改滑块的颜色，就要修改background的值，不要应用图片，只保留背景颜色：
background: yellow;2019-07-17 19:13:27赞同 展开评论 打赏
版权声明：本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
相关问答
