右下角可关闭和最小化悬浮广告效果

来源:https://www.sucaihuo.com/js/1833.html 2017-04-26 18:38浏览(627) 收藏

此作品是JquerySchool网站右下角可关闭和最小化悬浮广告效果,jquery学堂群的网友问可以整理下来分享吗,这个当然可以啦,用法也很简单,大家下载下来自己看一下吧。。。 如果不行找到demo。html
右下角可关闭和最小化悬浮广告效果
分类:悬浮层/弹出层 > 弹窗 难易:初级
查看演示 下载资源 下载积分: 20 积分

首先引用文件

<link href="css/ad.css?v=5" rel="stylesheet" type="text/css">
<script type="text/javascript" src="js/ad.js"></script>

JquerySchool网站上的效果只要网友们喜欢的,都可以整理出来分享,此作品非常实用和常用,主要是用来展示广告,很多网站上都用得上, js核心功能代码如下:

window.onload = function() {
    var oDiv = document.getElementById('miaov_float_layer');
    var oBtnMin = document.getElementById('btn_min');
    var oBtnClose = document.getElementById('btn_close');
    var oDivContent = oDiv.getElementsByTagName('div')[0];

    var iMaxHeight = 0;

    var isIE6 = window.navigator.userAgent.match(/MSIE 6/ig) && !window.navigator.userAgent.match(/MSIE 7|8/ig);

    oDiv.style.display = 'block';
    iMaxHeight = oDivContent.offsetHeight;

    if (isIE6) {
        oDiv.style.position = 'absolute';
        repositionAbsolute();
        miaovAddEvent(window, 'scroll', repositionAbsolute);
        miaovAddEvent(window, 'resize', repositionAbsolute);
    }
    else {
        oDiv.style.position = 'fixed';
        repositionFixed();
        miaovAddEvent(window, 'resize', repositionFixed);
    }

    oBtnMin.timer = null;
    oBtnMin.isMax = true;
    oBtnMin.onclick = function() {
        startMove
		(
			oDivContent, (this.isMax = !this.isMax) ? iMaxHeight : 0,
			function() {
			    oBtnMin.className = oBtnMin.className == 'min' ? 'max' : 'min';
			}
		);
    };

    oBtnClose.onclick = function() {
        oDiv.style.display = 'none';
        oDiv.innerHTML = "";
    };
};

function startMove(obj, iTarget, fnCallBackEnd)
{
	if(obj.timer)
	{
		clearInterval(obj.timer);
	}
	obj.timer=setInterval
	(
		function ()
		{
			doMove(obj, iTarget, fnCallBackEnd);
		},30
	);
}
评论0
头像

系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791

1 2