zoukankan      html  css  js  c++  java
  • 实现Jquery触发一事件后,停留5秒,再接着触发下面的事件

    这里是一个广告位的Jquery的代码,有两个不同的广告位,一个是中间浮动显示的,显示5秒后自动消失,并限定每天仅出现一次(Cookie实现):

    //=====================广告位的js=====================
    $(document).ready(function(){
        //广告位中心浮动 5秒后自动消失或者点击关闭
        $("#bannerFloatCenter").css("left",($(document).width()-250)/2) ;
        //根据cookie来判断是否要显示中心区广告:
        if(!isSetCookie()){
            $("#bannerFloatCenter").fadeIn(2000,function(){
                window.setTimeout('$("#bannerFloatCenter").slideUp(1000);',5000);
            });
            $("#bannerFloatCenter span").click(function(){
                $("#bannerFloatCenter").slideUp(1000);                                            
            });
        }        
        
        // 广告位右栏浮动 随滚动条滚动而上下移动,可以点击关闭消失
        $(window).scroll(function() {
            var offsetTop = 130 + $(window).scrollTop() + "px"; 
            $("#bannerFloatFlowScroll").animate({ top: offsetTop }, { duration: 300, queue: false })
        }); 
        $("#bannerFloatFlowScroll span").click(function(){
            $("#bannerFloatFlowScroll").slideUp();                                       
        });
    });

    下面是两个广告位的Div:

    <!-- 广告位中心浮动 5秒后自动消失或者点击关闭消失 -->
        <div id="bannerFloatCenter" style="position:absolute;z-index:2;left:483px; top:275px; border:#9DCE63 4px solid; display:none;">
            <a href="http://www.cntronics.com/public/lecture/list?cid=7"><img id="onsemi_1" src="<?php echo $this->baseUrl();?>/images/semiwelcomebanner_250.jpg"/></a>
            <span title="关闭" style="position:absolute; cursor:pointer;left:213px;top:-17px;font-size:12px;">[关闭]</span>
        </div>
        <!-- 广告位右栏浮动 随滚动条滚动而上下移动,可以点击关闭消失-->
        <div id="bannerFloatFlowScroll" style="position:absolute; z-index:2; right:50px;top:133px;">
            <a href="http://www.cntronics.com/public/whitepaper/index/sp/22"><img id="onsemi_2" src="<?php echo $this->baseUrl();?>/images/semisidebanner_120.jpg"/></a>
            <span title="关闭" style="position:absolute; cursor:pointer;left:80px;top:-14px;font-size:12px;">[关闭]</span>
        </div>

    还有一种写法是把setTimeout()函数放出来:

    <script language="javascript">
        function reloadNewQuestion(){
            //jquery code
            var no = Math.random();
            var url = "<?php echo $this->baseUrl();?>/webinar/index/newquestion/no/"+no;
            $(".content.content_1 ul").load(url);
            setTimeout("reloadNewQuestion()",60000);
        }
    </script>
    
    <script language="javascript">
        $(document).ready(){
            reloadNewQuestion();
        }
    </script>
  • 相关阅读:
    Python for Data Science
    Python for Data Science
    Python for Data Science
    Python for Data Science
    Python for Data Science
    Python for Data Science
    Python for Data Science
    Python for Data Science
    Python for Data Science
    软件工程实践总结
  • 原文地址:https://www.cnblogs.com/roboot/p/4787839.html
Copyright © 2011-2022 走看看