回到默认图片的我已经做好了。现在求：如何加特效
0
悬赏园豆：20
[已关闭问题]
关闭于 2009-07-02 13:45
原来那个不能修改了，所以从开了一个
不会用JQ。这个听过，见过，没用过，所以不会用jq。
回到默认图片的我已经做好了，如果不要特效，这个是一个不错的图片新闻的效果。适当修改还可以在下面加上文字。
如果这么做太难，那请帮我做一个迅雷首页的那种上下滑动的效果。
修改好的完整代码如下：
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>图片切换</title>
</head>
<style type="text/css">
<!--
body {margin-left: 0px;margin-top: 0px;background-color: #B1B2B4;background-image: url(images/bg.jpg);background-repeat: repeat-x;margin-right: 0px;margin-bottom: 0px;}
body,td,th {font-family: Verdana, Geneva, sans-serif;font-size: 12px;}
ul{ padding:0 0; margin:0 0;}
li{ list-style: none; margin:0 0; padding:0 0;}
#cont{ width:1004px; padding:0 0; margin:0 0;}
#change_pic{ width:722px; height:241px; background:#FDF0E0 url(images/ex_index_04.jpg) left top no-repeat; overflow:hidden; padding:0 0; position:relative;}
#change_btn{ width:138px; height:231px; overflow:hidden; float:left;}
#change_btn li{background:#FFF;WIDTH: 138px; height:56px; margin-bottom:2px; text-align:center;CURSOR: pointer;}
#change_btn .current {BACKGROUND:#D22425;}
#change_btn img{ margin-top:3px; border:0;}
#notop{ margin-top:0px;}
#change_piclist {overflow:hidden;width:578px;height:231px; float:left; margin-left:3px;}
#change_piclist LI {OVERFLOW: hidden; WIDTH: 578px; HEIGHT: 231px}
#change_piclist IMG {WIDTH: 578px; HEIGHT: 230px; border:0;}
#change_piclist .normal {DISPLAY: none}
#change_def1{ width:725px; height:5px; line-height:4px; font-size:4px; overflow:hidden;}
#change_def3{ clear:both; width:725px; height:5px; line-height:5px; font-size:3px; overflow:hidden;}
#change_def2{ width:3px; height:231px; font-size:3px; overflow:hidden; float:left;}
#change_cent{ width:719px; height:231px;float:left;}
-->
</style>
<script language="javascript" type="text/javascript">
function $d(A){return document.getElementById(A)}
function classNormal(a,b){
var c=$d(a).getElementsByTagName("li");
var d=$d(b).getElementsByTagName("li");
for(var e=0;e<d.length;e++){
c[e].className="normal";
d[e].className="normal";
}
}
function classCurrent(a,b,c){
var d=$d(a).getElementsByTagName("li");
var e=$d(b).getElementsByTagName("li");
d[c].className="current";
if (c>0){
c=c-1;
e[c].className="current";
}
}
function FocusChange(){
if(!$d("change_pic")){return false}
for(var i=1;i<4;i++){
var P=$d("change_def"+i);
P.onmouseout=function(){
classNormal("change_piclist","change_btn");
classCurrent("change_piclist","change_btn",0)
};
}
var A=$d("change_btn").getElementsByTagName("li");
A[0].onmouseover=function(){
classNormal("change_piclist","change_btn");
classCurrent("change_piclist","change_btn",1)
};
A[1].onmouseover=function(){
classNormal("change_piclist","change_btn");
classCurrent("change_piclist","change_btn",2)
};
A[2].onmouseover=function(){
classNormal("change_piclist","change_btn");
classCurrent("change_piclist","change_btn",3)
};
A[3].onmouseover=function(){
classNormal("change_piclist","change_btn");
classCurrent("change_piclist","change_btn",4)
};
var B=$d("change_piclist").getElementsByTagName("li");
for(var e=1;e<B.length;e++){
B[e].onmouseout=function(){
classNormal("change_piclist","change_btn");
classCurrent("change_piclist","change_btn",0)
};
}
}
</script>
<body>
<div id="change_pic">
<div id="change_def1"></div>
<div id="change_def2"></div>
<div id="change_cent">
<div id="change_btn">
<ul>
<li class="normal"><a href="#"><IMG src="http://www.52tbz.cn/images/s10.jpg" ></a></li>
<li class="normal"><a href="#"><IMG src="http://www.52tbz.cn/images/s13.jpg" ></a></li>
<li class="normal"><a href="#"><IMG src="http://www.52tbz.cn/images/s15.jpg" ></a></li>
<li class="normal"><a href="#"><IMG src="http://www.52tbz.cn/images/s17.jpg" ></a></li>
</ul>
</div>
<DIV id="change_piclist">
<UL>
<LI class="current"><A href="#"><IMG alt="" src="http://www.52tbz.cn/images/01.jpg"></A> </LI>
<LI class="normal"><A href="#"><IMG alt="" src="http://www.52tbz.cn/images/02.jpg"></A> </LI>
<LI class="normal"><A href="#"><IMG alt="" src="http://www.52tbz.cn/images/03.jpg"></A></LI>
<LI class="normal"><A href="#"><IMG alt="" src="http://www.52tbz.cn/images/04.jpg"></A></LI>
<LI class="normal"><A href="#"><IMG alt="" src="http://www.52tbz.cn/images/05.jpg"></A></LI>
</UL>
</DIV>
</div>
<div id="change_def3"></div>
</div>
<SCRIPT type=text/javascript>FocusChange();</SCRIPT>
</body>
</html>
所有回答(0)
