黑龙码

js控制联动滚动条,2个滚动条同时联动代码

晓峰 时间:2023-10-16 00:51:24 阅读:240
--------------------------------------------------------- Ta 只分享的内容开始 ---------------------------------------------------------------------

js控制联动滚动条,2个滚动条同时联动代码


html

<div class="gongfama"></div>
<div class="gongfuma2"></div>

js代码

 
    // 滚动条同步
    var gongfuma=document.querySelector('.gongfuma')
    var gongfuma2=document.querySelector('.gongfuma2')
    gongfuma.addEventListener('scroll',function(){
        gongfuma2.scrollLeft = gongfuma.scrollLeft; // 左右滚动
        console.log('zhixing');
        gongfuma2.scrollTop = gongfuma.scrollTop; // 上下滚动
    })
    // gongfuma 滚动 让gongfuma2也滚动
    gongfuma2.addEventListener('scroll',function(){ 
        gongfuma.scrollLeft = gongfuma2.scrollLeft;
        console.log('zhixing');
        gongfuma.scrollTop = gongfuma2.scrollTop; 
    })


--------------------------------------------------------- Ta 只分享了这些内容 ---------------------------------------------------------------------

本文来源:黑龙码(gongfuma.com.cn)
声明:本文系黑龙码原创稿件,版权属[黑龙码 gongfuma.com.cn]所有。
未经授权不得转载,已经协议授权的媒体下载使用时须注明"稿件来源:黑龙码",违者将依法追究责任。

相关文章

  • 回到顶部