A-A+

jquery scroll()和resize()增加延时处理示例

2016年01月11日 web前端设计 暂无评论 阅读 7 views 次

本文章为各位介绍一个关于jquery scroll()和resize()增加延时处理示例,如果各位对于scroll()和resize()用法不了解的可以和小编一起来看看吧。

浏览器的scroll()和resize()方法都是实时处理的,比如浏览器拉动浏览器的过程中一直在触发scroll(),浏览器的在改变大小尺寸的时候一直在触发resize(),如果在这两个方法里加上函数之后,会一直不间断的去处理,很可能造成浏览器负荷。

解决的方法就是延时,当然还有其他方法。比如,原先的处理方法是:

  1. $(window).scroll(function()  
  2. {  
  3.  alert();  
  4. });  

拉动浏览器的过程中一直alert。

修改后:

  1. var timer=0;  
  2. $(window).scroll(function()  
  3. {  
  4.  if(timer)  
  5.  {  
  6.   clearTimeout(timer);  
  7.   timer=0;  
  8.  }  
  9.  timer=setTimeout(function()  
  10.  {  
  11.   alert();  
  12.  },300);  
  13. });  
  14. //或者:  
  15. var timer=0;  
  16. $(window).scroll(function()  
  17. {  
  18.  if(timer)  
  19.  {  
  20.   clearTimeout(timer);  
  21.   timer=0;  
  22.  }  
  23.  timer=setTimeout(scroll_fn,300);  
  24. });  
  25. scroll_fn=function()  
  26. {  
  27.  alert();  
  28. }  
标签:

给我留言