JS——jquery UI
Posted 高圈圈
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JS——jquery UI相关的知识，希望对你有一定的参考价值。
1. draggable()
滑动条demo：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css"> .con{ width:300px; height:300px; border:1px solid #000; margin:50px auto 0; } .box{ width:50px; height:50px; background-color:hotpink; cursor:pointer; } </style> <script type="text/javascript" src="js/jquery-1.12.4.min.js"></script> <script type="text/javascript" src="js/jquery-ui.min.js"></script> <script type="text/javascript"> $(function () { //使得box可以鼠标拖动 $(‘.box‘).draggable({ //约束元素在父级内拖动 containment:‘parent‘, //约束元素只能横向拖动 axis:‘x‘, //元素拖动时透明度变为0.6 opacity:0.6, //ui里面有什么可以用console.log（ui）查看 drag:function (ev,ui) { var nowleft = ui.position.left; } }); }) </script> </head> <body> <div class="con"> <div class="box"></div> </div> </body> </html>
以上是关于JS——jquery UI的主要内容，如果未能解决你的问题，请参考以下文章