87,997
社区成员




<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<style type="text/css">
html,body{overflow:hidden; height:100%; width:100%;margin:0; padding:0;}
#back1,#back0{transition: all 0.5s ease-in 0.2s;}
</style>
</head>
<body>
<div id="back0" style="position:absolute;width:100%;height:100%;margin:0;padding:0; opacity:1;"><img id="img0" style="height:100%;width:100%" src="./images/b.gif" /></div>
<div id="back1" style="position:absolute;width:100%;height:100%;margin:0;padding:0; opacity:0;"><img id="img1" style="height:100%;width:100%" src="images/b.gif" /></div>
<script>
//根据需要设置
var delay=10*1000;//轮播时间间隔单位毫秒
var max=9;//共有多少张图片,图片编号必须从1开始如1.jpg,2.jpg...
var i=0;
var current=0;
var images=arr_random(max);
var clientWidth=document.documentElement.clientWidth;
var clientHeight=document.documentElement.clientHeight;
var width=height=0;
window.onload=function(){
width=document.getElementById('img0').width;
height=document.getElementById('img0').height;
}
var src='./images/'+(images[i]+1)+'.jpg';
var loading0 = new Image();
loading0.src=src;
document.getElementById('img'+current).src=src;
setTimeout(function () {loadCheck(loading0); }, 50);
window.setInterval(function(){
i++;
if(i>max) i=1;
src='./images/'+(images[i]+1)+'.jpg';
var loading = new Image();
loading.src=src;
setTimeout(function () {loadCheck(loading); }, 50);
},delay);
function setImage(){
var r0=clientWidth/clientHeight;
var r1=width/height;
if(r0>r1){//width充满
w=clientWidth;
h=w*(height/width);
}else{
h=clientHeight;
w=h*(width/height);
}
if(current>0) var current1=0;
else var current1=1;
document.getElementById('img'+current1).src=src;
document.getElementById('img'+current1).style.width=w+'px';
document.getElementById('img'+current1).style.height=h+'px';
document.getElementById('back'+current).style.opacity=0;
document.getElementById('back'+current).style.zIndex=0;
document.getElementById('back'+current1).style.opacity=1;
document.getElementById('back'+current1).style.zIndex=1;
current=current1;
}
function loadCheck(loadding) {
if(loadding.complete) {
width = loadding.width;
height = loadding.height;
setImage();
}
};
window.onresize=function(){
clientWidth=document.documentElement.clientWidth;
clientHeight=document.documentElement.clientHeight;
setImage();
}
function arr_random(num) {
var arr=[];
for (var i = 0; i < num; i++) {
arr[i] = i;
}
for (var i = 0; i < num; i++) {
var iRand = parseInt(num * Math.random());
var temp = arr[i];
arr[i] = arr[iRand];
arr[iRand] = temp;
}
return arr;
}
</script>
</body>
</html>