zoukankan      html  css  js  c++  java
  • jquery 插件 轻量级jquery对联广告 优装网对联广告 jquery.couplet

    话不多说了,jquery对联广告插件,支持载fash和图片。预览效果见优装网——专业 时尚 亲民 河南装修建材行业网络媒体引领者

    原理很简单,就是浮动 position:absolute,可关闭

    //轻量级jquery对联广告插件
    //
    版权 优装网 www.youzhuang.net
    //
    作者 逐月 zhuyue.cnblogs.com
    //
    演示 http://www.youzhuang.net
    //
    调用方法
    //
    $("body").couplet({100,height:300,leftCouplet:"http://www.youzhuang.net/ad/left.swf",rightCouplet:"http://www.youzhuang.net/ad/right.swf"});});
    //
    调用参数
    //
    100,--宽 默认宽度100
    //
    height:300,--总高 默认高度 300
    //
    top:100,广告距顶部的高度
    //
    leftCouplet:"http://www.youzhuang.net/ad/left.swf",左则flash地址或图片地址
    //
    leftLink:"http://www.youzhuang.net/",左则连接地址,广告是图片时需要
    //
    rightCouplet:"http://www.youzhuang.net/ad/right.swf",右则flash地址或图片地址
    //
    rightLink:"http://www.youzhuang.net/"右则连接地址,广告是图片时需要

    jQuery.fn.couplet = function(settings) {

    settings = jQuery.extend({
    100,
    height:300,
    top:100,
    leftCouplet:"",
    leftLink:"http://www.youzhuang.net/",
    rightCouplet:"",
    rightLink:"http://www.youzhuang.net/"
    },
    settings);
    var s = this;
    //添加广告窗口
    s.append("<div class=\"couplet\" id=\"leftCouplet\" style=\""+settings.width+";left:10px;top:0px; position:absolute;background:#e5e5e5;\"></div>");
    s.append("<div class=\"couplet\" id=\"rightCouplet\" style=\""+settings.width+";right:10px;top:0px; position:absolute;background:#e5e5e5;\"></div>");
    var leftCouplet = s.children("#leftCouplet");
    var rightCouplet = s.children("#rightCouplet");
    //加载左则广告
               if(settings.leftCouplet.substring(settings.leftCouplet.lastIndexOf('.')).toLowerCase() == ".swf"){
                   leftCouplet.append("<embed src=\"" + settings.leftCouplet + "\" width=\"" + settings.width + "\" height=\"" + settings.height + "\" </embed>");
               }else{
                    leftCouplet.append("<a href='"+settings.leftLink+"' target='_blank'><img src=\""+settings.leftCouplet+"\" width=\""+settings.width+"\"  height=\""+settings.height+"\"/></a>");
               }
               //加载右则广告
               if(settings.rightCouplet.substring(settings.rightCouplet.lastIndexOf('.')).toLowerCase() == ".swf"){
                   rightCouplet.append("<embed src=\"" + settings.rightCouplet + "\" width=\"" + settings.width + "\" height=\"" + settings.height + "\" </embed>");
               }else{
                    rightCouplet.append("<a href='"+settings.rightLink+"' target='_blank'><img src=\""+settings.rightCouplet+"\" width=\""+settings.width+"\"  height=\""+settings.height+"\"/></a>");
               }
               var closeBtn = "<div class=\"coupletClose\" style=\"text-align:center;padding:2px 0px;font-size:12px;cursor:pointer \">关闭</label>";
    leftCouplet.append(closeBtn);
    rightCouplet.append(closeBtn);
    $(".coupletClose").click(function(){
    leftCouplet.remove();
    rightCouplet.remove();
    });

    //显示对联
    show();

    function show(){
    var winTop = $(window).scrollTop();
    $(".couplet").animate({
    top: winTop + settings.top
    }, 300);

    };
    //滚动条事件
    $(window).scroll(function() {
    $(".couplet").stop();
    show();
    });

    };



  • 相关阅读:
    ubuntu下Thrift快速入门
    java Future用法和意义一句话击破 [转]
    RPC、基于netty的长连接和websocket
    基于netty的长连接
    IO
    HTML5 中websocket长连接的具体实现方法
    单链表中是否出现环状,使用快慢指针算法。
    SpringMVC 事务配置完全详解
    hibernate annotation 一对多,多对一,实例
    tomcat 内存溢出
  • 原文地址:https://www.cnblogs.com/zhuyue/p/2220563.html
Copyright © 2011-2022 走看看