您好,欢迎来到jQuery吧!QQ群:193687763(钱端开发)

jQuery吧-Write Less, Do More | 注重前端开发

  • jquery实现可关闭及重复播放泰山压顶广告特效

    jquery实现可关闭及重复播放泰山压顶广告特效

    jquery实现可关闭及重复播放泰山压顶广告特效
    jquery实现可关闭及重复播放泰山压顶广告特效
    js代码

    //首页大广告var gg960ShowTime = 10000; //播放时间var gg960Time = null;function open_gg960(showBtn) { $('.gg_full .gg_fcon').html(gg960Con).slideDown(300, function() { if (showBtn !== false) { $('.gg_full .gg_fbtn').fadeIn(); } if (gg960Time) { clearTimeout(gg960Time); } gg960Time = setTimeout(close_gg960, gg960ShowTime); });}function close_gg960() { $('.gg_full .gg_fcon').slideUp(500, function() { $(this).html(''); $('.gg_fclose').hide(); $('.gg_freplay').show(); });}$('.gg_fclose').click(function() { if (gg960Time) { clearTimeout(gg960Time); } close_gg960(); return false;});$('.gg_freplay').click(function() { if (gg960Time) { clearTimeout(gg960Time); } open_gg960(false); $('.gg_freplay').hide(); $('.gg_fclose').show(); return false;});var gg960Con;var fullAdType = 'swf';var fullAdUrl = '/'var fullAdName = 'images/qpad.swf';;if (fullAdName) { if (fullAdType == 'swf') { gg960Con = '<embed wmode="transparent" height="400" width="980" flashvars="alink1=' + fullAdUrl + '" allowscriptaccess="always" quality="high" name="Advertisement" id="Advertisement" style="" src="images/qpad.swf" type="application/x-shockwave-flash"></embed>'; } else { gg960Con = '<a href="' + fullAdUrl + '" target="_blank"><img width="980" height="400" src="images/qpad.jpg"/></a>'; //flash无法显示时,显示JPG广告 } setTimeout(open_gg960, 1500); //延迟显示}

    下载地址
    预览地址

  • jQuery旋转广告牌特效

    jQuery旋转广告牌特效

    jQuery旋转广告牌特效
    jQuery旋转广告牌特效
    js代码

    <script src="jquery-1.3.2.js" type="text/javascript"></script><script> $(function() { $('#ad_1 > img').each(function(i, e) { rotate($(this), 500, 3000, i); }); function rotate(elem1, speed, timeout, i) { elem1.animate({ 'marginLeft': '18px', 'width': '0px' }, speed, function() { var other; if (elem1.parent().attr('id') == 'ad_1') other = $('#ad_2').children('img').eq(i); else other = $('#ad_1').children('img').eq(i); other.animate({ 'marginLeft': '0px', 'width': '35px' }, speed, function() { var f = function() { rotate(other, speed, timeout, i) }; setTimeout(f, timeout); }); }); } });</script>

    下载地址
    预览地址

  • jQuery可拉下的幕布广告效果代码

    jQuery可拉下的幕布广告效果代码

    jQuery拉下的幕布广告效果代码
    jQuery可拉下的幕布广告效果代码
    部分js代码

    $(document).ready(function() { $('#howdy').howdyDo({ action: 'hover', effect: 'slide', easing: 'easeInOutExpo', duration: 600, openAnchor: '<img src="images/down-arr-16x16.png" border=0 />', closeAnchor: '<img src="images/close-16x16.png" border=0 />' });});

    下载地址
    预览地址

  • 不随滚动条滚动的固定层jQuery广告代码

    不随滚动条滚动的固定层jQuery广告代码

    不随滚动条滚动固定层jQuery广告代码
    不随滚动条滚动的固定层jQuery广告代码
    jQ代码

    // 固定层function buffer(a,b,c){var d;return function(){if(d)return;d=setTimeout(function(){a.call(this),d=undefined},b)}}(function(){function e(){var d=document.body.scrollTop||document.documentElement.scrollTop;d>b?(a.className="div1 div2",c&&(a.style.top=d-b+"px")):a.className="div1"}var a=document.getElementById("float");if(a==undefined)return!1;var b=0,c,d=a;while(d)b+=d.offsetTop,d=d.offsetParent;c=window.ActiveXObject&&!window.XMLHttpRequest;if(!c||!0)window.onscroll=buffer(e,150,this)})();

    下载地址
    预览地址

  • jQuery漂浮动图片广告代码

    jQuery漂浮动图片广告代码

    jQuery漂浮动图片广告代码
    jQuery漂浮动图片广告代码
    部分js代码

    <script type="text/javascript">$(function(){ $.floatingAd({ //频率 delay: 60, //超链接后是否关闭漂浮 isLinkClosed: true, //漂浮内容 ad: [{ //关闭区域背景透明度(0.1-1) headFilter: 0.3, //图片 'img': 'images/baidu_sylogo1.gif', //图片高度 //'imgHeight': 220, //图片宽度 //'imgWidth': 176, //图片链接 'linkUrl': 'http://www.baidu.com/', //浮动层级别 'z-index': 100, //标题 'title': '度娘' },{ 'img': 'images/logo_png.png', //'imgHeight': 220, //'imgWidth': 176, 'linkUrl': 'http://www.google.com/', 'z-index': 101, 'title': '谷歌', //关闭按键图片 'closed-icon': 'images/list-remove.png' }], //关闭事件 onClose: function(elem){ alert('关闭'); } }); $("#aa").floatingAd({ onClose:function(elem){} }); });</script>

    天外飞仙的在线效果DEMO

  • jQuery全屏广告收缩显示代码

    jQuery全屏广告收缩显示代码

    jQuery全屏广告收缩显示代码
    jQuery全屏广告收缩显示代码
    基于jquery的全屏广告,首先是全屏显示,然后在指定时间内收缩显示,但不消失。你可以在topad.js中定义等待多少时间显示全屏,也可以定义显示全屏的时间。

    在topad.js中的如下地方修改时间:

    $(function(){ //过两秒显示 showImage(); 内容 setTimeout("showImage();",2000); //alert(location);});function showImage(){ $("#adBig").slideUp(1000,function(){$("#adSmall").slideDown(1000);});}

    天外飞仙的在线效果DEMO

  • 支持下拉幕布的jQuery广告代码

    支持下拉幕布的jQuery广告代码

    支持下拉幕布的jQuery广告代码
    支持下拉幕布的jQuery广告代码

    $(document).ready( function(){ $( '#howdy' ).howdyDo({ action : 'hover', effect : 'slide', easing : 'easeInOutExpo', duration : 600, openAnchor : '<img src="images/down-arr-16x16.png" border=0 />', closeAnchor : '<img src="images/close-16x16.png" border=0 />' });});

    天外飞仙的在线效果DEMO

  • 上下滚动图片jQuery的banner广告代码

    上下滚动图片jQuery的banner广告代码

    上下滚动图片jQuerybanner广告代码
    上下滚动图片jQuery的banner广告代码
    部分jq代码

    <script type=text/javascript>$(function() { var index = 0; var adtimer; var _wrap = $("#container ol"); // var len = $("#container ol li").length; //len=1; if (len > 1) { $("#container").hover(function() { clearInterval(adtimer); }, function() { adtimer = setInterval(function() { var _field = _wrap.find('li:first'); //此变量不可放置于函数起始处,li:first取值是变化的 var _h = _field.height(); //取得每次滚动高度(多行滚动情况下,此变量不可置于开始处,否则会有间隔时长延时) _field.animate({ marginTop: -_h + 'px' }, 500, function() { //通过取负margin值,隐藏第一行 _field.css('marginTop', 0).appendTo(_wrap); //隐藏后,将该行的margin值置零,并插入到最后,实现无缝滚动 }) }, 5000); }).trigger("mouseleave"); function showImg(index) { var Height = $("#container").height(); $("#container ol").stop().animate({ marginTop: -_h + 'px' }, 1000); } $("#container").mouseover(function() { $("#container .mouse_direction").css("display", "block"); }); $("#container").mouseout(function() { $("#container .mouse_direction").css("display", "none"); }); } $("#container").find(".mouse_top").click(function() { var _field = _wrap.find('li:first'); //此变量不可放置于函数起始处,li:first取值是变化的 var last = _wrap.find('li:last'); //此变量不可放置于函数起始处,li:last取值是变化的 //last.prependTo(_wrap); var _h = last.height(); $("#container ol").css('marginTop', -_h + "px"); last.prependTo(_wrap); $("#container ol").animate({ marginTop: 0 }, 500, function() { //通过取负margin值,隐藏第一行 //$("#container ol").css('marginTop',0).prependTo(_wrap);//隐藏后,将该行的margin值置零,并插入到最后,实现无缝滚动 }) }); $("#container").find(".mouse_bottom").click(function() { var _field = _wrap.find('li:first'); //此变量不可放置于函数起始处,li:first取值是变化的 var _h = _field.height(); _field.animate({ marginTop: -_h + 'px' }, 500, function() { //通过取负margin值,隐藏第一行 _field.css('marginTop', 0).appendTo(_wrap); //隐藏后,将该行的margin值置零,并插入到最后,实现无缝滚动 }) });});</script>

    天外飞仙的在线效果DEMO

  • jQuery结合CSS3实现风琴折叠图片效果广告代码

    jQuery结合CSS3实现风琴折叠图片效果广告代码

    jQuery结合CSS3实现风琴折叠图片效果广告代码
    jQuery结合CSS3实现风琴折叠图片效果广告代码
    部分jq代码

    $(function() { $('#accordion > li').hover( function () { var $this = $(this); $this.stop().animate({'width':'480px'},500); $('.heading',$this).stop(true,true).fadeOut(); $('.bgDescription',$this).stop(true,true).slideDown(500); $('.description',$this).stop(true,true).fadeIn(); }, function () { var $this = $(this); $this.stop().animate({'width':'115px'},1000); $('.heading',$this).stop(true,true).fadeIn(); $('.description',$this).stop(true,true).fadeOut(500); $('.bgDescription',$this).stop(true,true).slideUp(700); } ); });

    天外飞仙的在线效果DEMO

  • jquery广告倒计时显示代码

    jquery广告倒计时显示代码

    jquery广告倒计时显示代码
    jquery广告倒计时显示代码
    部分jq代码

    // JavaScript Documentfunction lxfEndtime(){ $t=$('#t').html(); if($t!=0){ $('#t').html($t-1); $i=setTimeout("lxfEndtime()",1000); }else{ $('.box').hide(); $('.btn').show(); $('#t').html(6); $('.ad_time').css({'width':'554px','height':'351px'}); clearTimeout($i); }};$(document).ready(function(){ $('.btn').live('click',function(){ $('.box').show(); $(this).hide(); $('.ad_time').animate({width:110,height:18},'slow'); lxfEndtime(); }) $('.close').click(function(){ $('.box').hide(); $('.btn').show(); $('#t').html(6); $('.ad_time').css({'width':'554px','height':'351px'}); clearTimeout($i); }) });

    天外飞仙的在线效果DEMO

jQuery吧-Write Less, Do More | 注重前端开发

jQuery吧-Write Less, Do More | 注重前端开发

Copyright © 2013 jqueryba.com, All Rights Reserved.奔跑在阿里云

免责声明:本站所有内容来源于互联网。如果本站部分内容侵犯您的权益,请您告知,站长会立即处理 苏ICP备12059471号

站内所有资源仅供学习与参考,请勿用于商业用途,否则产生的一切后果将由您自己承担!