jQuery插件实现DIV固定在页面中

转自给力技术

　　我们浏览网站的时候，经常能看到固定在页面中且不会随着滚动条滚动的DIV层，这样的浮动效果可通过Portamento这个jQuery插件实现。

jQuery插件实现DIV浮动在页面固定位置中

　　Portamento是一个轻量级的jQuery插件，它具有简单并且容易使用的特点。使用此插件，只需一行代码便可实现网页元素浮动于固定位置的效果。它会检测浏览器大小是否足以显示浮动层，如果过小将不会浮动显示。Portamento也提供了几个参数可供设置，定制性也是比较高的。
如何使用

　　此插件的使用方法其实很简单，首先要引入jQuery库和portamento插件，如下

<script src="jquery-1.4.2.min.js"></script>
<script src="portamento-min.js"></script>

　　对需要设置浮动的元素添加必要的CSS样式，代码如下(sidebar即为浮动的元素)

#portamento_container {float:right; position:relative;}
#portamento_container #sidebar {float:none; position:absolute;}
#portamento_container #sidebar.fixed {position:fixed;}

　　最后初始化即可，完整代码可查看文后的演示

$('#sidebar').portamento();

查看演示