zoukankan      html  css  js  c++  java
  • jquery实现可展开收缩的首页大图广告展示方式 泰山压顶代码 V2.0

    把代码做成js网站进行统一调用

    if (typeof jQuery == 'undefined') {
     document.writeln('<script type="text/javascript" src="../jquery.js"></script>'); }
    else {
    // jQuery 已加载
    }
    
    //泰山压顶主要js代码
    document.writeln('<script type="text/javascript" src="../top.js"></script>');    
    top.js代码为:
    document.writeln('<div class="advbox" style="text-align: center;">');
    document.writeln('<div class="dt_small" style="display:none;">');
    document.writeln('<div class="dt_toBig" style="display:none;"></div>');
    document.writeln('<a href="#" target="_blank"><img src="../images/Small.jpg" width="984" height="130" alt="图片缩略图" /></a> </div>');
    document.writeln('<div class="dt_big">');
    document.writeln('<div class="dt_toSmall"></div>');
    document.writeln('<a href="#" target="_blank"><img id="actionimg" src="../images/big.jpg" width="986" height="283" alt="图片大图" /></a> </div>');
    document.writeln('</div>');
    
    
    function AdvClick(){
        var a=1500;
        var b=3*1000;
        $(".dt_toSmall").click(function(){
            $(".dt_small").delay(a).slideDown(a);
            $(".dt_big").stop().slideUp(a);
            $(".dt_toSmall").stop().fadeOut(0);
            $(".dt_toBig").delay(a*2).fadeIn(0)
        });$
        (".dt_toBig").click(function(){
            $(".dt_big").delay(a).slideDown(a);
            $(".dt_small").stop().slideUp(a);
            $(".dt_toBig").stop().fadeOut(0);
            $(".dt_toSmall").delay(a*2).fadeIn(0)
        })
    }
    
    function AdvAuto(){
        if($(".dt_big").length>0){
            var a=1500;
            var b=3*1000;
            $(".dt_big").delay(b).slideUp(a,function(){
                $(".dt_small").slideDown(a);
                $(".dt_toBig").delay(a).fadeIn(0)
            });
            $(".dt_toSmall").delay(b).fadeOut(0)
        }
    }
    
    
    $(document).ready(function(){
        AdvClick();
    });
    
    
    //顶部通览可展开收起效果
    if($("#actionimg").length>0){    
        $("#actionimg").onload=AdvAuto();
    }
    转载请注明出处: 欢迎留言或qq(1090413588)交流
  • 相关阅读:
    sql 生成随机数 以及不重复随机数
    值提供器 AND 模型绑定器
    web项目在iis配置好后不能正确访问问题集锦,以及IIS常规设置
    js
    性能优化
    MVC3;0问题与知识点
    EntityFramework
    MSSQL2008 临时总结文档2014
    py--使用__slots__
    py--使用@property
  • 原文地址:https://www.cnblogs.com/linyusong/p/5912705.html
Copyright © 2011-2022 走看看