四虎精品视频-四虎精品成人免费网站-四虎黄色网-四虎国产视频-国产免费91-国产蜜臀97一区二区三区

javascript跟隨滾動條滾動的層(浮動AD效果)

其實這個效果在很多網站中都能見到,其主要表現為網頁兩側的浮動廣告。看起來感覺很難做,但其實原理是很簡單的,使用定時器沒0.1秒檢測層的位置并將其置在指定的位置(相對于窗口)。寫了一個簡單的代碼:

[Ctrl+A 全選 注:如需引入外部Js需刷新才能執行]
注意:
if (window.innerHeight) {
       posX = window.pageXOffset;
       posY = window.pageYOffset;
   }
   else if (document.documentElement && document.documentElement.scrollTop) {
       posX = document.documentElement.scrollLeft;
       posY = document.documentElement.scrollTop;
   }
   else if (document.body) {
       posX = document.body.scrollLeft;
       posY = document.body.scrollTop;
   }
這段代碼是為了兼容標準,在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">

加上這段后,document.body.scrollTop永遠等于0


body onscroll = "alert(document.body.scrollTop);"永遠也不會引發。


解決辦法:

使用:

document.documentElement.scrollTop 

示例一:

var scrollPos; 
if (typeof window.pageYOffset != 'undefined') { 
  scrollPos = window.pageYOffset; 

else if (typeof document.compatMode != 'undefined' && 
    document.compatMode != 'BackCompat') { 
  scrollPos = document.documentElement.scrollTop; 

else if (typeof document.body != 'undefined') { 
  scrollPos = document.body.scrollTop; 

alert(scrollPos);


示例二:

function WebForm_GetScrollX() 
{
   if (__nonMSDOMBrowser) 
   {
       return window.pageXOffset;
   }
   else 
   {
       if (document.documentElement && document.documentElement.scrollLeft) 
       {
           return document.documentElement.scrollLeft;
       }
       else if (document.body) 
       {
           return document.body.scrollLeft;
       }
   }
   return 0;
}


-------------------------------------
pageYOffset是NETscape的
document.body.scrollTop和document.documentElement.scrollTop是ie的,但我不知道他們的真正區別,只知道documentElement.scrollTop是xhtml兼容的(我用的是strict)

JavaScript技術javascript跟隨滾動條滾動的層(浮動AD效果),轉載需保留來源!

鄭重聲明:本文版權歸原作者所有,轉載文章僅為傳播更多信息之目的,如作者信息標記有誤,請第一時間聯系我們修改或刪除,多謝。

主站蜘蛛池模板: 八年级上册英语第三单元2b翻译| 威虎山黑话大全口令| 红灯区1996| 都市频道节目表今天| 电子元器件基础知识| 有完没完电影| 鲁迅手抄报图片| 免费完整版在线观看| 钱月笙| 八下数学练习册答案| 全国第一小县| 抖音平台| 局外人电影| 秋天不回来吉他谱扫弦| 欧美一级黄色录像| 女人天下150集国语版电视剧| 尹雪喜新建文件夹2| 小镇姑娘高清播放| 女子露胸| 安珀·赫德| 安多卫视直播在线观看| 蓝眼泪简谱| 循环小数除法50道| 陷入纯情| 不潮不花钱歌词| urban legend| 漆黑意志| 高级英语第四版课后答案| 曹查理电影大全免费观看| 中川翔子| 黄秋生的电影| 三年片大全电影| 黑木美纱| 小班安全开学第一课| 演员孙阳个人简介身高| va电影| 幸福年简谱| 头像女可爱卡通| 李轻扬| 女子露胸| 裸色亮片|