腳本源代碼
<body>
<style>
body {background
color:#
}
#all {width:
px; height:
px; background
color:#FFFFFF; overflow:hidden; }
#left {width:
px; background
color:#F
FF
; float:left; height:
px}
#left li {cursor:hand; font:bold
px
Arial Black
; list
style:circle; margin
left:
px; color:#FFFFFF}
#right {width:
px; background
color:#FFFF
; float:left; height:
px; cursor:hand;font:bold
px
Arial Black
; color: #
}
</style>
<script language=
javascript
>
function $(id) {return document
getElementById(id)}
function left(id) {
var alla= $(
alla
);
var right= $(
right
);
var alla_left=parseInt(alla
style
marginLeft);
if (alla_left==
) {
if (id==
) {right
innerHTML=
#
AE
FA
;;right
style
backgroundColor=
#
AE
FA
}
else if (id==
) {right
innerHTML=
#ADFA
A
;right
style
backgroundColor=
#ADFA
A
}
else if (id==
) {right
innerHTML=
#F
A
F
;;right
style
backgroundColor=
#F
A
F
}
left_decrease()
}
if (alla_left==
) {right_decrease()}
}
function left_decrease() {
var alla= $(
alla
);
var alla_left=parseInt(alla
style
marginLeft);
if (alla_left==
) {clearTimeout(time)}
else {
alla
style
marginLeft=alla_left
;
time= setTimeout(
left_decrease()
)
}
}
function right_decrease() {
var alla= document
getElementById(
alla
);
var alla_left=parseInt(alla
style
marginLeft);
if (alla_left==
) {clearTimeout(time)}
else {
alla
style
marginLeft=alla_left+
;
time= setTimeout(
right_decrease()
)}
}
</script>
<div id=
all
>
<div id=
alla
>
<div id=
left
>
<ul>
<li onclick=
left(
)
>color
</li>
<li onclick=
left(
)
>color
</li>
<li onclick=
left(
)
>color
</li>
</ul>
</div>
<div id=
right
onclick=
left()
></div>
</div>
</div>
</body>
From:http://tw.wingwit.com/Article/program/Java/JSP/201311/19226.html
