您的位置:首页 > 其它

图片翻页幻灯效果

2009-11-23 18:50 260 查看
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>无标题页</title>
</head>
<META http-equiv="Content-Type" content="text/html; charset=gb2312">
<mce:style type="text/css"><!--
select {}{ font-family: "tahoma"; font-size: 10px; color: #666666}
input {}{ font-family: "tahoma"; font-size: 10px; color: #000000; border: #666666; border-style: solid; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px}
--></mce:style><style type="text/css" mce_bogus="1"> select {}{ font-family: "tahoma"; font-size: 10px; color: #666666}
input {}{ font-family: "tahoma"; font-size: 10px; color: #000000; border: #666666; border-style: solid; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px}</style>
<script type="text/javascript">

var rotate_delay = 1000; // delay in milliseconds (5000 = 5 secs)
current = 0;
function next() {
if (document.slideform.slide[current+1]) {
document.images.show.src = document.slideform.slide[current+1].value;
document.slideform.slide.selectedIndex = ++current;
}
else first();
}
function previous() {
if (current-1 >= 0) {
document.images.show.src = document.slideform.slide[current-1].value;
document.slideform.slide.selectedIndex = --current;
}
else last();
}
function first() {
current = 0;
document.images.show.src = document.slideform.slide[0].value;
document.slideform.slide.selectedIndex = 0;
}
function last() {
current = document.slideform.slide.length-1;
document.images.show.src = document.slideform.slide[current].value;
document.slideform.slide.selectedIndex = current;
}
function ap(text) {
document.slideform.slidebutton.value = (text == "Stop") ? "Start" : "Stop";
rotate();
}
function change() {
current = document.slideform.slide.selectedIndex;
document.images.show.src = document.slideform.slide[current].value;
}
function rotate() {
if (document.slideform.slidebutton.value == "Stop") {
current = (current == document.slideform.slide.length-1) ? 0 : current+1;
document.images.show.src = document.slideform.slide[current].value;
document.slideform.slide.selectedIndex = current;
window.setTimeout("rotate()", rotate_delay);
}
}

</SCRIPT>
<body bgcolor="#ffffff" text="#000000">
<form name="slideform">
<table cellspacing="1" cellpadding="4" bgcolor="#000000">
<tr>
<td align="center" bgcolor="white" width="200" height="200">
<img src="images/add.png" mce_src="images/add.png" name="show">
</td>
</tr>
<tr>
<td align="center" bgcolor="#c0c0c0">
<select name="slide" onChange="change();">
<option value="images/add_user.png" selected>1</option>

<option value="images/back.png">2</option>

<option value="images/bing.png">3</option>

<option value="images/chart_up.png">4</option>

<option value="images/person.png">5</option>

<option value="images/new.png">6</option>

<option value="images/info.png">7</option>

<option value="images/edit_profile.png">8</option>

<option value="images/edit_profile.png">9</option>

<option value="images/view.png">10</option>
</select>
</td>
</tr>
<tr>
<td align="center" bgcolor="#c0c0c0">
<input type="button" onClick="first();" value="|<<" title="Beginning"> <input type="button" onClick="previous();" value="<<" title="Previous">
<input type="button" name="slidebutton" onClick="ap(this.value);" value="开始" title="AutoPlay">
<input type="button" onClick="next();" value=">>" title="Next"> <input type="button" onClick="last();" value=">>|" title="End">
</td>
</tr>
</table>
</form>
</body>

</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: