页面广告飘窗


HTML结构如下

<div class="fafa" style="width: 160px;height: 160px;background: #acf;position: fixed;z-index: 999;"></div>

  js逻辑也非常简单,就是移动left和top的值,代码如下

!function($dom){
	var winWidth = window.innerWidth;                    
	var winHeight = window.innerHeight;
	window.onresize = function(){
		winWidth = window.innerWidth;                    
		winHeight = window.innerHeight;
	}
	var $left = 0,$top = 0,a = 1,b = 1,speed = 2;
	function goFun(posit,speed){
		return posit + speed;
	}
	var t = setInterval(function(){
		$left = goFun($left,speed*a)
		if( $left >= (winWidth-$dom.offsetWidth)){
			a = -1;
		}else if($left <= 0){
			a = 1;
		}
		$top = goFun($top,speed*b)
		if( $top >= (winHeight-$dom.offsetHeight)){
			b = -1;
		}else if($top <= 0){
			b = 1;
		}
		$dom.style.cssText += "left:"+$left+"px;top:"+$top+"px";
	},20)
}(document.getElementsByClassName('fafa')[0]);

  


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM