龙盟编程博客 | 无障碍搜索 | 云盘搜索神器
快速搜索
主页 > web编程 > php编程 >

由页面倾斜扩展的页面晃动

时间:2014-07-22 14:49来源: 作者: 点击:
分享到:
由页面倾斜扩展的页面晃动,前几天的页面倾斜效果很流行,随之而来的晃动效果也开发出来了... br / 演示地址: a href=http://www.phperzone.cn/demo/js/huangdong.html target=_blank rel=nofollowhttp://www
由页面倾斜扩展的页面晃动,前几天的页面倾斜效果很流行,随之而来的晃动效果也开发出来了...
演示地址: http://www.phperzone.cn/demo/js/huangdong.html
var i = 1;
var num = 0.1;
var j = 20;
var nums = -17;
function Jump(){
	if(num>0){
		num = num + (i*0.1);
	}else{
		num = num - (i*0.1);
	}
	num = 0-num;
	var a = document.getElementById("test");
    a.innerHTML ="<style> body{-o-transform: rotate("+num+"deg);-webkit-transform: rotate("+num+"deg);-moz-transform: rotate("+num+"deg);}</style>"
	i++;
	if(i<20){
		document.onload = setTimeout("Jump()",500);
	}else{
		document.onload = setTimeout("Jumps()",500);
	}
}
function Jumps(){
	if(nums>0){
		nums = nums - (j*0.1);
	}else{
		nums = nums + (j*0.1);
	}
	nums = 0-nums;
	var a = document.getElementById("test");
    a.innerHTML ="<style> body{-o-transform: rotate("+nums+"deg);-webkit-transform: rotate("+nums+"deg);-moz-transform: rotate("+nums+"deg);}</style>"
	j--;
	if(j>1){
		document.onload = setTimeout("Jumps()",500);
	}
}
document.onload = setTimeout("Jump()",3000);
精彩图集

赞助商链接