滚动条

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>滚动条</title> <style type="text/css">*{margin:0; padding:0;} .wrapper{ width:500px; height:500px; border:1px solid #000; margin:0 auto; } .content{ width:445px; height:400px; overflow:hidden; text-indent:2em;margin:50px 0 0 20px; float:left; line-height:22px;} .track{ width:15px; height:400px; background:#ccc; float:right; margin:50px 10px 0 0 ;} .track .thum{ width:15px; height:30px; background:#eee; cursor:pointer; position:absolute; }</style> <div class="wrapper"> <div class="content"> <div> 哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈 美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美 哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈 美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈 美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈 美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美美123 </div> </div> <div class="track"> <div class="thum"></div> </div> </div> 要点：1.点击的时候，禁止文本选中：$(document).bind('selectstart',function(){return false;})2.拖动的时候，拖动事件加在document上；3.div滚动的高度/div滚动部分内容的高度=滑块距滚槽顶部的高度/滚槽的高度；4.解除绑定事件要写在mousedown事件里面；