复制代码代码如下:
<٪@ page language = "java" import = "java.util.*" pageencoding = "ISO-8859-1" ٪>
<٪
string path = request.getContextPath () ؛
String BasePath = request.getScheme ()+": //"+request.getServerName ()+":"+request.getServerPort ()+path+"/" ؛
٪>
<! doctype html public "-// w3c // dtd html 4.01 Transitional // en">
<html>
<head>
<base href = "<٪ = basepath ٪>">
<title> my jsp 'tu.jsp' صفحة البدء </title>
<meta http-equiv = "pragma" content = "no-cache">
<meta http-equiv = "cache-control" content = "no-cache">
<meta http-equiv = "Expires" content = "0">
<meta http-equiv = "الكلمات الرئيسية" content = "Keyword1 ، Keyword2 ، Keyword3">
<meta http-equiv = "description" content = "This is is my past">
<type type = "text/css">
* {
الهامش: 0px ؛
الحشو: 0px ؛
}
لي {
على غرار القائمة: لا شيء ؛
}
IMG {
الحدود: 0 ؛
}
أ {
تدمير النص: لا شيء ؛
}
#SLIDE {
العرض: 800 بكسل ؛
الارتفاع: 400 بكسل ؛
box-shadow: 0px 0px 5px #c1c1c1 ؛
الهامش: 20 بكسل Auto ؛
الموقف: قريب
الفائض: مخفي.
}
#SLIDE UL {
الموقف: مطلق ؛
اليسار: 0px ؛
أعلى: 0px ؛
الارتفاع: 400 بكسل ؛
العرض: 11930px ؛
}
#slide ul li {
العرض: 800 بكسل ؛
الارتفاع: 400 بكسل ؛
الفائض: مخفي.
تعويم: اليسار.
}
#SLIDE .ICO {
العرض: 800 بكسل ؛
الارتفاع: 20 بكسل ؛
الفائض: مخفي.
محاذاة النص: المركز ؛
الموقف: مطلق ؛
اليسار: 0px ؛
أسفل: 10 بكسل ؛
Z-index: 1 ؛
}
#SLIDE .ICO A {
العرض: كتلة مضمنة.
العرض: 10px ؛
الارتفاع: 10 بكسل ؛
الخلفية: url (out.png) no-repeat 0px 0px ؛
الهامش: 0px 5px ؛
}
#SLIDE .ico .active {
الخلفية: url (out1.png) no-repeat 0px 0px ؛
}
#btnleft {
العرض: 60px ؛
الارتفاع: 400 بكسل ؛
اليسار: 0px ؛
أعلى: 0px ؛
الخلفية: url () no-repeat 0px 0px ؛
الموقف: مطلق ؛
Z-index: 2 ؛
}
#btnleft: hover {
الخلفية: url () no-repeat 0px 0px ؛
}
#btnright {
العرض: 60px ؛
الارتفاع: 400 بكسل ؛
اليمين: 0px ؛
أعلى: 0px ؛
الخلفية: url () no-repeat 0px 0px ؛
الموقف: مطلق ؛
Z-index: 2 ؛
}
#btnright: hover {
الخلفية: url () no-repeat 0px 0px ؛
}
</style>
<script type = "text/javaScript">
window.onload = function () {
var oico = document.getElementById ("ICO") ؛
var abtn = oico.getElementSbyTagName ("a") ؛
var oslide = document.getElementById ("slide") ؛
var oul = oslide.getElementSbyTagname ("ul") ؛
var ali = oul [0] .getElementsByTagName ("li") ؛
var obtnleft = document.getElementById ("btnleft") ؛
var obtnright = document.getElementById ("btnright") ؛
var basewidth = ali [0] .OffSetWidth ؛
// تنبيه (basewidth) ؛
oul [0] .style.width = basewidth * ali.length + "px" ؛
var inow = 0 ؛
لـ (var i = 0 ؛ i <abtn.length ؛ i ++) {
abtn [i] .index = i ؛
abtn [i] .onclick = function () {
//alert(this.index) ؛
//alert(oul budap0.
نقل (this.index) ؛
//aico budapthis.index.
}
}
Obtnleft.onclick = function () {
inow ++ ؛
//document.title = inow ؛
تحرك (غير) ؛
}
obtnright.onclick = function () {
inow -؛
document.title = inow ؛
تحرك (غير) ؛
}
var curindex = 0 ؛
var timeInterval = 1000 ؛
setInterval (التغيير ، timeInterval) ؛
تغيير الوظيفة () {
if (curindex == abtn.length) {
curindex = 0 ؛
} آخر {
نقل (curindex) ؛
curindex += 1 ؛
}
}
وظيفة نقل (فهرس) {
//document.title = index ؛
if (index> ali.length-1) {
الفهرس = 0 ؛
inow = فهرس ؛
}
إذا (الفهرس <0) {
الفهرس = ali.length - 1 ؛
inow = فهرس ؛
}
لـ (var n = 0 ؛ n <abtn.length ؛ n ++) {
abtn [n] .className = "" ؛
}
abtn [index] .className = "Active" ؛
oul [0] .style.left = -index * basewidth + "px" ؛
// buffer (oul [0] ، {
// اليسار: -index * basewidth
//} ، 8)
}
}
</script>
</head>
<body>
<div id = "slide">
<a id = "btnleft" href = "javaScript: void (0) ؛" > </a>
<a id = "btnright" href = "javaScript: void (0) ؛" > </a>
<!-عند تغيير الصورة التالية: style = "Left:-(N-1)*800px ؛"->
<ul>
<li> <img src = "images/anniu.png"/> </li>
<li> <img src = "Images/Zhu2.png"/> </li>
<li> <img src = "Images/XiangQing5.png"/> </li>
<li> <img src = "الصور/wanle.png"/> </li>
</ul>
<div id = "ICO">
<a href = "javaScript: void (0) ؛"> </a>
<a href = "javaScript: void (0) ؛"> </a>
<a href = "javaScript: void (0) ؛"> </a>
<a href = "javaScript: void (0) ؛"> </a>
<a href = "javaScript: void (0) ؛"> </a>
<a href = "javaScript: void (0) ؛"> </a>
</div>
</div>
</body>
</html>