网页制作如何让鼠标划过A图后,B图变C图

网页制作不是用任何软件,只是html语言:如何让鼠标经划过A图后,旁边的B图变C图.鼠标指向其他地方时B图不变?... 网页制作不是用任何软件, 只是html语言:

如何让鼠标经划过A图后, 旁边的B图变C图. 鼠标指向其他地方时B图不变? 展开

 我来答

2个回答

#合辑# 机票是越早买越便宜吗？

shuiwowo
2009-02-20 · TA获得超过188个赞

知道答主

回答量：64

采纳率：0%

帮助的人：35.6万

我也去答题访问个人页

关注

展开全部

js可以实现这个东西

这个放在页面里面
<body></body> 之间
<table width=325 border=0 cellpadding=0 cellspacing=0>
<tr valign=top>
<td colspan=3><a onClick="gotoshow()" onMouseOver="tu_ove()" onMouseOut="ou()" style="cursor:hand"><img src="images/ad-01.jpg" width=325 height=190 name="slide" border=0></a></td>
</tr>
<tr>
<td width=229 height="19" align=center bgcolor=#f4f4f4 class="white"><div id=textslide>焦点图标题层</div></td>
<td width=1 bgcolor=#7C7C7C><div style="position:relative">
<div style="position:absolute;top:10px">
<table width=95 border=0 cellpadding=0 cellspacing=0>
<tr valign=top align=center>
<td width="19" height="0"><div style="position:relative">
<div id=xiaotu1 style="position:absolute;top:-19px;left:0px"><img src=images/bian1.gif id=xiaosan1 width=10 height=3 border=0></div>
</div></td>
<td width="19" height="0"><div style="position:relative">
<div id=xiaotu2 style="position:absolute;top:-19px;left:0px"><img src=images/bian1.gif id=xiaosan2 width=10 height=3></div>
</div></td>
<td width="19" height="0"><div style="position:relative">
<div id=xiaotu3 style="position:absolute;top:-19px;left:0px"><img src=images/bian1.gif id=xiaosan3 width=10 height=3></div>
</div></td>
<td width="19" height="0"><div style="position:relative">
<div id=xiaotu4 style="position:absolute;top:-19px;left:0px"><img src=images/bian1.gif id=xiaosan4 width=10 height=3></div>
</div></td>
<td width="19" height="0"><div style="position:relative; left: 1px;">
<div id=xiaotu5 style="position:absolute;top:-19px;left:0px"><img src=images/bian1.gif id=xiaosan5 width=10 height=3></div>
</div></td>
</tr>
</table>
</div>
</div></td>
<td width=95 height="19"><table width=95 border=0 cellpadding=0 cellspacing=0>
<tr valign=top>
<td width="19" height="19" class="homejdboder"><a style="cursor:hand" onMouseOver="ove(0)" onMouseOut="ou()"><img src="images/1.gif" width="19" height="19" border=0></a></td>
<td width="19" height="19" class="homejdboder"><a style="cursor:hand" onMouseOver="ove(1)" onMouseOut="ou()"><img src="images/2.gif" width="19" height="19" border=0></a></td>
<td width="19" height="19" class="homejdboder"><a style="cursor:hand" onMouseOver="ove(2)" onMouseOut="ou()"><img src="images/3.gif" width="19" height="19" border=0></a></td>
<td width="19" height="19" class="homejdboder"><a style="cursor:hand" onMouseOver="ove(3)" onMouseOut="ou()"><img src="images/4.gif" width="19" height="19" border=0></a></td>
<td width="19" height="19"><a style="cursor:hand" onMouseOver="ove(4)" onMouseOut="ou()"><img src="images/5.gif" width="19" height="19" border=0></a></td>
</tr>
</table></td>
</tr>
</table>

这个是js脚本

//slideimages数组为变换的图
var slideimages=new Array();
slideimages[0]="images/ad-01.jpg";
slideimages[1]="images/ad-02.jpg";
slideimages[2]="images/ad-03.jpg";
slideimages[3]="images/ad-04.jpg";
slideimages[4]="images/ad-05.jpg";

//slidetext数组为变换的文字
var slidetext=new Array();
slidetext[0]="焦点图01";
slidetext[1]="焦点图02";
slidetext[2]="焦点图03";
slidetext[3]="焦点图04";
slidetext[4]="焦点图05";

//slidetext数组为点击大图后跳到的地址
var slidelinks=new Array();
slidelinks[0]="http://www.lanrentuku.com";
slidelinks[1]="http://www.lanrentuku.com";
slidelinks[2]="http://www.lanrentuku.com";
slidelinks[3]="http://www.lanrentuku.com";
slidelinks[4]="http://www.lanrentuku.com";

//焦点图初始内容－－start
var slidespeed=3000

var slidesanjiaoimages=new Array("images/bian2.gif","images/bian1.gif");
var slidesanjiaoimagesname=new Array("xiaosan1","xiaosan2","xiaosan3","xiaosan4","xiaosan5");

var filterArray=new Array();
filterArray[0]="progid:DXImageTransform.Microsoft.Pixelate (enabled=false,duration=2,maxSquare=25 )";
filterArray[1]="progid:DXImageTransform.Microsoft.Stretch (duration=1,stretchStyle=PUSH)";
filterArray[2]="progid:DXImageTransform.Microsoft.Stretch(duration=1)";
filterArray[3]="progid:DXImageTransform.Microsoft.Slide(bands=8, duration=1)";
filterArray[4]="progid:DXImageTransform.Microsoft.Fade ( duration=1,overlap=0.25 )";

var imageholder=new Array()
var ie55=window.createPopup
for (i=0;i<slideimages.length;i++){
imageholder[i]=new Image()
imageholder[i].src=slideimages[i]
}

function tu_ove(){clearTimeout(setID)}
function ou(){slideit()}

var whichlink=0
var whichimage=0

function gotoshow(){
window.open(slidelinks[whichlink]);
}

function slideit(){

document.images.slide.style.filter=filterArray[whichimage];
//alert(document.images.slide.style.filter);
pixeldelay=(ie55)? (document.images.slide.filters[0].duration*1000) : 0
//alert(pixeldelay);
if (!document.images) return

if (ie55) {
document.images.slide.filters[0].apply();
document.images.slide.filters[0].play();

}
document.images.slide.src=imageholder[whichimage].src

document.getElementById("textslide").innerText=slidetext[whichimage];

document.getElementById("xiaosan1").src=slidesanjiaoimages[0];
document.getElementById("xiaosan2").src=slidesanjiaoimages[0];
document.getElementById("xiaosan3").src=slidesanjiaoimages[0];
document.getElementById("xiaosan4").src=slidesanjiaoimages[0];
document.getElementById("xiaosan5").src=slidesanjiaoimages[0];

document.getElementById(slidesanjiaoimagesname[whichimage]).src=slidesanjiaoimages[1];

if (ie55) document.images.slide.filters[0].play()
whichlink=whichimage
whichimage=(whichimage<slideimages.length-1)? whichimage+1 : 0
setID=setTimeout("slideit()",slidespeed+pixeldelay)
}
slideit()
function ove(n){
clearTimeout(setID)
whichimage=n;
document.images.slide.src=imageholder[whichimage].src

document.getElementById("textslide").innerText=slidetext[whichimage];
document.getElementById("xiaosan1").src=slidesanjiaoimages[0];
document.getElementById("xiaosan2").src=slidesanjiaoimages[0];
document.getElementById("xiaosan3").src=slidesanjiaoimages[0];
document.getElementById("xiaosan4").src=slidesanjiaoimages[0];
document.getElementById("xiaosan5").src=slidesanjiaoimages[0];
document.getElementById(slidesanjiaoimagesname[whichimage]).src=slidesanjiaoimages[1];
}

最好把js脚本放在js文件夹名称是5adpics.js，不然就起个喜欢的名字，然后在网页里面把名字改下，基本上是鼠标滑过12345这些图片的时候ad-01、ad-02这些图片会发生改变，图片的大小数量都是可以变得

本回答由提问者推荐

已赞过 已踩过<

评论收起

热点亮点
2009-02-14 · TA获得超过378个赞

知道小有建树答主

回答量：258

采纳率：0%

帮助的人：139万

我也去答题访问个人页

关注

展开全部

我也想知道

已赞过 已踩过<

评论收起

推荐律师服务：若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询

网页制作 如何让鼠标划过A图后,B图变C图

为你推荐：

网页制作如何让鼠标划过A图后,B图变C图