zoukankan      html  css  js  c++  java
  • JQuery 浮动广告

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>跟随广告实例</title>
    <style type="text/css">
    <!--
    body{ font
    -family:Tahoma, Geneva, sans-serif; font-size:12px; height:3000px;}
    *{ margin:0; padding:0;}
    #ad{ position:absolute; right:
    0; bottom:0; 360px; height:190px; background:url(bot_left.png) no-repeat scroll 0 0; display:none; font-size:12px; line-height:10px; z-index:999;}
    #close{ 12px; height:12px; background:url(close.gif) no
    -repeat scroll 0 0; cursor:pointer; position:absolute; right:9px; top:14px; z-index:999;}
    -->
    </style>
    <script type="text/javascript" src="http://www.enjoyeasy.com.cn/js/jquery.min.js"></script>
    <script type="text/javascript">
      $(function(){
       var name 
    = $('#ad');  //滚动广告的ID
       function showAd(time){
         setTimeout(function(){
          $(name).show();},time);
        }
        
       function hideAd(time){
         setTimeout(function(){
          $(name).hide();},time);
        }

       $(
    '#close').click(function(){
         $(name).hide();
        });
      
       
       showAd(
    1000); //页面加载完毕多久后显示广告
       
       
    //hideAd(3000); //页面加载完毕多久后关闭广告

       function scrollAd(){
         var offset 
    = $(window).height() - $(name).height() + $(document).scrollTop();
         $(name).animate({top:offset},{duration:
    800,queue:false});
        } 
        
       scrollAd();
       
       $(window).scroll(scrollAd);
      });
    </script>
    </head>

    <body>


    <div id="ad">
    <span id="close">sdfsdfsddfgdfgdfgdfgdfg</span>
    </div>


    </body>
    </html>
  • 相关阅读:
    git clone代码总是失败
    sublime常用快捷键及插件
    canvas圆形倒计时
    box-show的用法
    全选、反选
    数据库,增删改查
    PHP操作MySQL
    输出六个随机字符串
    约瑟夫环的故事
    Unix编程艺术——摘录一
  • 原文地址:https://www.cnblogs.com/Fooo/p/1503654.html
Copyright © 2011-2022 走看看