HTML

首先我们看下左右侧浮动广告及关闭按钮HTML代码：

<div class="fixediv leftadv">
    <a href="https://jy.tp.yuanmeng.life/"><img src="images/180.jpg" width="140" height="186" alt="性感美女" /></a>
    <a class="close" href="javascript:void(0);">关闭广告</a>
</div>

<div class="fixediv rightadv">
    <a href="https://jy.tp.yuanmeng.life/"><img src="images/280.jpg" width="140" height="186" alt="清纯美女" /></a>
    <a class="close" href="javascript:void(0);">关闭广告</a>
</div>

jQuery

接着我们调用floatadv插件：

$(function() {
    $(".fixediv").floatadv(); //广告浮动
});

关闭广告：

$(".fixediv a").click(function() { //关闭广告
    $(".fixediv").fadeOut(400);
});

floatadv插件封装方法：

jQuery.fn.floatadv = function(loaded) { 
    var obj = this;
    body_height = parseInt($(window).height());
    block_height = parseInt(obj.height());

    top_position = parseInt((body_height / 2) - (block_height / 2) + $(window).scrollTop());
    if (body_height < block_height) {
        top_position = 0 + $(window).scrollTop();
    }

    if (!loaded) {
        obj.css({
            'position': 'absolute'
        });
        obj.css({
            'top': top_position
        });
        $(window).bind('resize',
        function() {
            obj.floatadv(!loaded);
        });
        $(window).bind('scroll',
        function() {
            obj.floatadv(!loaded);
        });
    } else {
        obj.stop();
        obj.css({
            'position': 'absolute'
        });
        obj.animate({
            'top': top_position
        },
        400, 'linear');
    }
}