這是一個跟隨滾動條漂浮的JS特效，就是說滾動條滾動而元素相對屏幕位置不變
網上有很多類似的效果，本代碼比較起來有如下優點：
1. 兼容IE6.0+ & FF1.5+
2. 使用非常簡單，屬于菜鳥最愛的那種拿來就能用的，見下面說明
3. 元素之間不會起沖突，一頁中可以有n個特效，多元素使用無代碼冗余
缺點有：
1. 只能在聲明為xHTML的文檔中使用
2. 元素最好放在body下
3. 滾動時不可避免的會有閃爍（已經比較輕微，但追求完美者可能覺得不爽）
使用說明：
在頁面中引用JS包，然后在需要特效的div上設定class為xScrollStick即可，當然不要忘記給每個元素寫上你希望它固定的位置
示例1：
代碼如下:
<div class="xScrollStick" style="left:0px;top:0px">
Content...
</div>
示例2：
代碼如下:
<div class="xScrollStick positionStyleName">
Content...
</div>
演示：
運行代碼框
[Ctrl+A 全選 注:如需引入外部Js需刷新才能執行]
頁面由兩個個部分組成：
頁面文件：
代碼拷貝框
代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=gb2312" />
<title>xScrollStick Demo</title>
<script type="text/javascript" src="sp/js/xscrollstick.js"></script>
<style>
.xScrollStick{
position:absolute;
padding:15px;
border:1px solid black;
width:120px;
height:24px;
}
.d1 { left:0px;top:0px; }
.d2 { right:0px;top:0px; }
.d3 { left:0px;bottom:0px; }
.d4 { right:0px;bottom:0px; }
</style>
</head>
新聞熱點
疑難解答
圖片精選
