javascript - jq怎么做局部div滾動?
問題描述
<style>.top , .bottom{height:130px;background:#000;} .center{height:400px;overflow:hidden;position:relative;}.center .box{width:100%;height:100%;position:absolute;}.center .box ul{overflow:hidden;}.center .box ul li{background:red;height:400px;width:100%;}</style>
<p class='top'></p>
<p class='center'> <p class='box'><ul><li></li><li></li></ul> </p></p>
<p class='bottom'></p>
jq怎么做ul li的局部滾動,中間這塊不能出現滾動條。還要考慮阻止瀏覽器滾動條事件。需求是:用鼠標滑輪滾動。li會下滾或者上滾。前提是我這個鼠標在這里center范圍,在范圍外面可以使用瀏覽器的滾動事件,里面的禁止。
問題解答
回答1:用這個scroll事件來控制box的position .
回答2:通過scroll事件來獲取滾動的方向,通過你自己的程序計算來調整p的position,css3可以用transform,不支持css3用left,top
回答3:外層包裹一個p,設置overflow:hidden,剛好覆蓋住內層的滾動條。鼠標滾動事件。$(’.center’).on()響應鼠標事件,然后阻止冒泡即可。
相關文章:
1. javascript - 關于css絕對定位在ios瀏覽器被橡皮筋遮擋的問題2. (python)關于如何做到按win+R再輸入文件文件名就可以運行?3. mysql - 分庫分表、分區、讀寫分離 這些都是用在什么場景下 ,會帶來哪些效率或者其他方面的好處4. Python如何播放還存在StringIO中的MP3?5. javascript - vue的element-ui(餓了嗎UI) webpack打包時externals無法分離6. javascript - 請教如何獲取百度貼吧新增的兩個加密參數7. css3 - 微信前端頁面遇到的transition過渡動畫的bug8. Python爬蟲如何爬取span和span中間的內容并分別存入字典里?9. python - 能通過CAN控制一部普通的家用轎車嗎?10. html5 - 只用CSS如何實現input框的寬度隨框里輸入的內容長短自動適應?
