13518219792
网站建设资讯

NEWS

网站建设资讯

jquery弹出层，并且遮罩透明，随页面滚动

  1.  
  2.  
  3.  
  4.  
  5. 无标题文档 
  6.  
  7. body {  
  8. font-family:Arial, Helvetica, sans-serif;  
  9. font-size:12px;  
  10. margin:0;  
  11. }  
  12. #main {  
  13. height:1800px;  
  14. padding-top:90px;  
  15. text-align:center;  
  16. }  
  17. #fullbg {  
  18. background-color:Gray;  
  19. left:0px;  
  20. opacity:0.5;  
  21. position:absolute;  
  22. top:0px;  
  23. z-index:3;  
  24. filter:alpha(opacity=50); /* IE6 */  
  25. -moz-opacity:0.5; /* Mozilla */  
  26. -khtml-opacity:0.5; /* Safari */  
  27. }  
  28. #dialog {  
  29. background-color:#FFF;  
  30. border:1px solid #888;  
  31. display:none;  
  32. height:200px;  
  33. left:50%;  
  34. margin:-100px 0 0 -100px;  
  35. padding:12px;  
  36. position:fixed !important; /* 浮动对话框 */  
  37. position:absolute;  
  38. top:50%;  
  39. width:200px;  
  40. z-index:5;  
  41. }#dialog p {margin:0 0 12px;    
  42. }    
  43. #dialog p.close {  
  44. text-align:right;  
  45. }  
  46.  
  47.  
  48.  
  49. 点击这里看 jQuery 遮罩层效果.   
 
  •  
  •  
  •  
    •  
  •  
  •  
  •  
  •  
  •  
  • 关闭

     

  • 正在加载，请稍后...

        
  •     
  •  
  •    
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  • //显示灰色 jQuery 遮罩层  
  • function showBg() {  
  • var bh = $("body").height();  
  • var bw = $("body").width();  
  • $("#fullbg").css({  
  • height:bh,  
  • width:bw,  
  • display:"block"  
  • });  
  • $("#dialog").show();  
  • }  
  • //关闭灰色 jQuery 遮罩  
  • function closeBg() {  
  • $("#fullbg,#dialog").hide();  
  • }  
  •     
  •  
  •    
  •  

    •  

    公司主营业务：成都网站设计、网站建设、移动网站开发等业务。帮助企业客户真正实现互联网宣传，提高企业的竞争能力。创新互联是一支青春激扬、勤奋敬业、活力青春激扬、勤奋敬业、活力澎湃、和谐高效的团队。公司秉承以“开放、自由、严谨、自律”为核心的企业文化，感谢他们对我们的高要求，感谢他们从不同领域给我们带来的挑战，让我们激情的团队有机会用头脑与智慧不断的给客户带来惊喜。创新互联推出天宁免费做网站回馈大家。


    文章名称：jquery弹出层，并且遮罩透明，随页面滚动
    网页链接：http://cdweb.net/article/gsocgj.html

    其他资讯