• 延时关闭的顶部广告


    一个非常简单的效果,写了个DEMO,主要是考虑了一下鼠标的交互,和广告开关方便,毕竟广告挺烦人的,不是每个人都想看。

     1 jQuery(function(){
     2         var adtimer=false;
     3         var admouse=false;
     4         var adcon=jQuery("#ad"); //广告主体
     5         var adshut=jQuery("#adshut"); //广告关闭按钮
     6         var adshow=jQuery("#adshow"); //广告重播
     7         var adelaytime=1000//页面加载完毕等待时间
     8         var adshowtime=5000//显示时间
     9         var admovespeed=600//缩放时间
    10         var showad=function(){ //显示
    11             adcon.slideDown(admovespeed);
    12             adshow.hide();
    13             }
    14         var hidead=    function(){ //隐藏
    15             adcon.slideUp(admovespeed,function(){adshow.show();});            
    16             }
    17         adtimer=setTimeout(showad,adelaytime);    //延时显示
    18         if(adtimer){ //延时隐藏
    19             admouse=setTimeout(hidead,adshowtime);
    20             }
    21         //鼠标进入广告区域取消延时关闭    如不需要则删除
    22         adcon.hover(function(){
    23                 if(admouse) clearTimeout(admouse);
    24             },function(){
    25                 admouse=setTimeout(hidead,adshowtime);
    26             })    
    27         //结束 adcon.hover
    28         //手动关闭广告按钮    
    29         adshut.click(function(){
    30             hidead();
    31         })
    32         adshow.click(function(){
    33             showad();
    34         })
    35         
    36         //结束

    37     }) 

  • 相关阅读:
    QTP 处理webtable中的数据
    Error 1406.Setup cannot write the value Microsoft
    QTP打开WinTree中的指定节点
    Excel数据操作
    VBS中实现函数多返回值
    QTP的回放模式
    VBS中运行应用程序的两种方式及WshShell对像浅析
    程序员奇葩面试的奇葩问题
    Android如何实现毛玻璃效果之Android高级模糊技术
    Android通过用代码画虚线椭圆边框背景来学习一下shape的用法
  • 原文地址:https://www.cnblogs.com/trance/p/1508419.html
Copyright © 2020-2023  润新知