jquery 漂浮图片广告代码

来源:互联网 发布:国学 育灵童 淘宝 编辑:程序博客网 时间:2024/05/01 03:00


(function($) {
    $.fn.floatAd = function(options) {
        var defaults = {
            imgSrc:"",
            url:"",
            openStyle: 1,
            speed: 30
        };
        var options = $.extend(defaults, options);
        var _target = options.openStyle == 1 ? "target='_blank'": '';
        var html = "<div id='float_ad' style='position:absolute;left:0px;top:0px;z-index:1000000;cleat:both;'>";
        html += "  <a href='" + options.url + "' " + _target + "><img src='" + options.imgSrc + "' border='0' class='float_ad_img'/></a>";
        html += "<div id='close_f_ad' style='position:absolute;width:14px;height:14px;top:0px;right:0px;cursor:pointer;float:right;font-size:14px;color:#FFF'>×</div></div>";
        $('body').append(html);
        function init() {
            var x = 0,
            y = 0;
            var xin = true,
            yin = true;
            var step = 1;
            var delay = 10;
            var obj = $("#float_ad");
            obj.find('img.float_ad_img').load(function() {
                var float = function() {
                    var L = T = 0;
                    var OW = obj.width();
                    var OH = obj.height();
                    var DW = $(document).width();
                    var DH = $(document).height();
                    x = x + step * (xin ? 1 : -1);
                    if (x < L) {
                        xin = true;
                        x = L;
                    }
                    if (x > DW - OW - 1) {
                        xin = false;
                        x = DW - OW - 1;
                    }
                    y = y + step * (yin ? 1 : -1);
                    if (y > DH - OH - 10) {
                        yin = false;
                        y = DH - OH - 10;
                    }
                    if (y < T) {
                        yin = true;
                        y = T;
                    }
                    var left = x;
                    var top = y;
                    obj.css({
                        'top': top,
                        'left': left
                    })
                };
                var itl = setInterval(float, options.speed);
                $('#float_ad').mouseover(function() {
                    clearInterval(itl)
                });
                $('#float_ad').mouseout(function() {
                    itl = setInterval(float, options.speed)
                })
            })
        }
        init();
$('#close_f_ad').click(function(){
                    $('#float_ad').css('display','none');
clearInterval(itl);
                });
    }
})(jQuery);


$(document).ready(function() {
    $(function() {
        $("body").floatAd({
            imgSrc:'图片.jpg',
            url: '链接地址'
        });
    })
});

0 0
原创粉丝点击