首页 > 语言 > JavaScript > 正文

可以浮动某个物体的jquery控件用法实例

2024-05-06 16:23:39
字体:
来源:转载
供稿:网友

这篇文章主要介绍了可以浮动某个物体的jquery控件,实例分析了jquery控件实现页面浮动层的使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下

本文实例讲述了可以浮动某个物体的jquery控件。分享给大家供大家参考。具体如下:

js代码如下:

 

 
  1. (function($){ 
  2. $.fn.scrolltip = function(){ 
  3. $(this).each( function() { 
  4. var obj = $(this); 
  5. var objtop = obj.position().top; 
  6. $(window).scroll(function(){ 
  7. obj.css({ 
  8. top:$(window).scrollTop()+objtop, 
  9. position:'absolute' 
  10. }); 
  11. }); 
  12. }); 
  13. })(jQuery); 

html代码如下:

 

 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"  
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"
  4. <head> 
  5. <script type="text/javascript" src="lib/jquery/jquery-1.3.2.js"></script> 
  6. <script type="text/javascript" src="js/tip.js"></script> 
  7. </script> 
  8. <title>JQuery</title> 
  9. </head> 
  10. <body><div style="height:300px;background:#eee"><span id="colspon"></span></div> 
  11. <br/> 
  12. <br/> 
  13. <br/> 
  14. <div id="float" style="width:744px;height:34px;border:1px solid #C0DBF8;"></div> 
  15. <div style="height:1000px;background:#eee"></div> 
  16. </body> 
  17. </html> 

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

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表

图片精选