[ JQUERY ] - 網址輪播

評等結果

點擊便能為這篇文章進行評等！

[評等總次數: 0，平均評等: 0]


<html>
<head>
<meta charset="utf-8">
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script>
var i=0;
var k=0;
function url_slider() {
//$('#main').fadeOut(); //A 換頁效果 淡出
$('#main').animate({height:'toggle'});//B 換頁效果 往上
$('#mask').animate({opacity:0.1});//B 換頁效果 遮罩透明度
url = new Array("http://weblife.tw","http://webteach.tw","http://od-design.net"); //輪播網址
k = i % url.length;
$('#show').attr("src",url[k]);//載入新的網址
$('#main').animate({height:'toggle'},1000);//B 換頁效果 往下
$('#mask').animate({opacity:0});//B 換頁效果 遮罩透明度
//$('#main').fadeIn(1500); //A 換頁效果 淡入
i++;
setTimeout("url_slider()",6000);//每6秒輪播一次
}
</script>
<style type="text/css">
body { margin: 0;}
#main { position:relative; }
#mask {
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
background-color:#000;
opacity:0.4;
filter:Alpha(opacity=0.4);
}
</style>
</head>
<body onload="url_slider()" oncontextmenu="window.event.returnValue=false;" ><!-- 禁用滑鼠右鍵選單 -->
<div id="main">
<iframe id="show" style="border:0; width:100%; height:100%; overflow:hidden" scrolling="no"></iframe>
<div id="mask"></div><!-- 遮罩 主要功能是不讓使用者使用滑鼠 -->
</div>
</body>
</html>

水壺背袋水壺網袋水瓶袋多色可選戶外郊遊登山野餐可放手機水壺背帶