js,鼠标上下滑轮或者拉动滚动条触发事件

JavaScript014

js,鼠标上下滑轮或者拉动滚动条触发事件,第1张

window.onmousewheel = function(){  //触发滚轮事件

}

window.onscroll = function(){  //滚动条事件

}

//其实你的问题直接使用判断滚动条应该就可以了，但是如果一定要拖动滚动条才执行事件，我们可以通过获取鼠标位置来模拟

var a = document.getElementsByTagName("html")[0]

window.onmousemove = function(){

        //一般默认滚动条12px宽，当鼠标位于浏览器窗口右边12px内按下鼠标可以视为拖动滚动条

if(innerWidth - event.clientX < 12){

a.onmousedown = function(){

console.log(1)

}

}else{

a.onmousedown = null

}

}

如果使用jquery的话，可以这样写：

$(window).bind("scroll", function(){ 

        var top = $(this).scrollTop() // 当前窗口的滚动距离

  })

如果使用原生js，可以这样写（摘自网上的）：

/** 

 * 获取<a href="https://www.baidu.com/s?wd=%E6%BB%9A%E5%8A%A8%E6%9D%A1&tn=44039180_cpr&fenlei=mv6quAkxTZn0IZRqIHckPjm4nH00T1YzPARYuhu9m1n3mhDknWmd0ZwV5Hcvrjm3rH6sPfKWUMw85HfYnjn4nH6sgvPsT6KdThsqpZwYTjCEQLGCpyw9Uz4Bmy-bIi4WUvYETgN-TLwGUv3EnHT1nWmLnW6snH03nHnkPHbYPs" target="_blank" class="baidu-highlight">滚动条</a>距离顶端的距离 

 * @return {}支持IE6 

 */  

function getScrollTop() {  

        var scrollPos  

        if (window.pageYOffset) {  

        scrollPos = window.pageYOffset }  

        else if (document.compatMode && document.compatMode != 'BackCompat')  

        { scrollPos = document.documentElement.scrollTop }  

        else if (document.body) { scrollPos = document.body.scrollTop }   

        return scrollPos   

}