一款支持鼠标拖动的jQuery滑块插件nstSlider.zip资源-CSDN文库

共5个文件

js：3个

html：1个

css：1个

版权申诉

前端代码

7 浏览量 2022-11-10 02:23:42 上传评论收藏 55KB ZIP 举报

资源推荐

资源详情

资源评论

收起资源包目录

一款支持鼠标拖动的jQuery滑块插件nstSlider.zip （5个子文件）

132677907866448416

css

jquery.nstSlider.css 960B

index.html 3KB

jquery.nstSlider.min.js 18KB

jquery-1.11.0.min.js 94KB

jquery.nstSlider.js 75KB

<!DOCTYPE html> <html lang="en"> <head> <meta charset="gb2312"> <title>jQuery滑块插件nstSlider.js</title>  <link type="text/css" rel="stylesheet" href="css/jquery.nstSlider.css"> </head> <body><center> <h1>jQuery滑块插件nstSlider.js</h1><br>  <div class="nstSlider" data-range_min="0" data-range_max="100" data-cur_min="10" data-cur_max="90">   <div class="highlightPanel"></div>  <div class="bar"></div>  <div class="leftGrip"></div>  <div class="rightGrip"></div>  </div>  <div class="leftLabel"></div> <div class="rightLabel"></div> </center>  <script src="js/jquery-1.11.0.min.js"></script>  <script src="js/jquery.nstSlider.min.js"></script>  <script> $('.nstSlider').nstSlider({ "left_grip_selector": ".leftGrip", "right_grip_selector": ".rightGrip", "value_bar_selector": ".bar", "highlight": { "grip_class": "gripHighlighted", "panel_selector": ".highlightPanel" }, "value_changed_callback": function(cause, leftValue, rightValue) { $('.leftLabel').text(leftValue); $('.rightLabel').text(rightValue); }, }); // Call methods and such... var highlightMin = Math.random() * 20, highlightMax = highlightMin + Math.random() * 80; $('.nstSlider').nstSlider('highlight_range', highlightMin, highlightMax); </script> <div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';"> </div> </body> </html>

评论收藏

内容反馈

版权申诉