本文实例讲述了jQuery实现的简单悬浮层功能。分享给大家供大家参考，具体如下：

运行效果图如下：

具体代码如下：

！DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www .w3。org/TR/XHTML 1/DTD/XHTML 1-Transitional。DTD ' html xmlns=' http://www .w3。org/1999/XHTML ' hearteta http-equiv=' Content-Type ' Content=' text/html；charset=utf-8 '/title test/title script type=' text/JAVAScript ' language=' JAVAScript ' src=' http : jquery-1。7 .2 .量滴js '/script script type=' text/JavaScript ' language=' JavaScript ' $(function(){ var timer，scrollTop，sideDiv=$('#fudong ').appendo(' body ')；$(窗口)。scroll(function(){ timer clear time out(计时器));scrollTop=$(this).滚动顶部()；timer=setTimeout(function(){ side div。动画({ top :滚动前100 ' px ' }，600)；}, 200);});});/script/head body div id=' fudong ' style=' border :1 px solid # 454545；宽度宽度：150像素高度：400 px绝对位置：right: 20pxtop: 100px '右侧悬浮层/div/body/html更多关于jQuery相关内容感兴趣的读者可查看本站专题： 《jQuery扩展技巧总结》 、 《jQuery常用插件及用法总结》 、 《jQuery拖拽特效与技巧总结》 、 《jQuery表格(table)操作技巧汇总》 、 《jquery中Ajax用法总结》 、 《jQuery常见经典特效汇总》 、 《jQuery动画与特效用法总结》 及《jquery选择器用法总结》

希望本文所述对大家jQuery程序设计有所帮助。