javascript跟随滚动条滚动,onscroll事件的学习_问答一下，轻松解决，电脑应用解决方案专家！

　　今天研究了一下,滚动条事件,也是在无忧上看到的,顺便做下记录@

　　比如做一个浮动广告效果,原理就是设置一个定时器0.1秒检测层所在的位置并将他指定到相当于窗口的位置.

　　核心代码如下（重点,也是常犯错误的地方:在xhtml页面中，document.body.scrollTop始终为0，即该属性无效，因此必须用其他的属性来判断，为兼容新旧标准，应该对属性的可用性进行判断。）:

						应用WEB标准会使ScrollTop属性失效！！！  

						<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0  Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  

						<html xmlns="http://www.w3.org/1999/xhtml">  

						加上这段后，<SPAN style="TEXT-DECORATION: underline">document.body.scrollTop永远等于0  

						</SPAN><SPAN style="COLOR: #800080"> 

						body onscroll = "alert(document.body.scrollTop);"永远也不会引发。   

						</SPAN>

解决办法：使用：

document.documentElement.scrollTop

下面有2个例子

										示例一：  

										<STRONG>var scrollPos;  

										if (typeof window.pageYOffset != 'undefined') {  <SPAN style="COLOR: #ff6600">//netscape  

										</SPAN>scrollPos = window.pageYOffset;  

										}  

										</STRONG>

							?

												<STRONG>else if (typeof document.compatMode != 'undefined' &&  

												document.compatMode != 'BackCompat') {  

												scrollPos = document.documentElement.scrollTop;  

												}  

												</STRONG>

							?

												<STRONG>else if (typeof document.body != 'undefined') {  

												scrollPos = document.body.scrollTop;  

												}  

												</STRONG>

							?

												<STRONG>alert(scrollPos);  

												</STRONG> 

												<SPAN style="TEXT-DECORATION: underline">示例二：  

												</SPAN>function WebForm_GetScrollX()  

												{  

												<STRONG>if (__nonMSDOMBrowser)  

												{  

												return window.pageXOffset;  

												}  

												else

												{  

												     if (document.documentElement && document.documentElement.scrollLeft)  

												     {  

												          return document.documentElement.scrollLeft;  

												      }  

												    else if (document.body)  

												    {  

												       return document.body.scrollLeft;  

												    }  

												}  

												</STRONG>    return 0;  

												}  

												@@@@@@ 

												pageYOffset是netscape的  

												document.body.scrollTop和document.documentElement.scrollTop是ie的，但我不知道他们的真正区别，

							?

												只知道documentElement.scrollTop是xhtml兼容的（作者用的是strict）

搜索

javascript跟随滚动条滚动,onscroll事件的学习