第一个jQuery demo ，鼠标换过，变换图片。
<!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=gb2312" />
<title>无标题文档</title>
<script language="JavaScript" src="jquery.js"></script>
</head>
<body>
<style type="text/css">
#research_main{
width:796px;
height:auto
}
#leftside{
float:left;
width:28%;
}
#middlesile{
float:left;
width:40%
}
#rightsile{
float:left;
width:28%
}
.singleone{
width:98%;
padding: 0px 5px;
}
.singleone h3{
font-size:13px;
color:#97cace;
margin:0px;
padding:0px;
background:url(yfheader_bg.jpg) no-repeat
}
.singleone p{
width:100%;
text-align:justify;
text-justify:inter-ideograph
}
#middlesile img{
border:none;
}
</style>
<script language="JavaScript">
$(document).ready(function(){ //页面加载后，加载的方法
$("#fristarea").mouseover(function(){
//document.getElementById("telogyimg").src ="changeone.jpg";//用js实现
$("#telogyimg").attr("src","changeone.jpg");
});
$("#vedioarea").mouseover(function(){
$("#telogyimg").attr("src","default.jpg");
});
});
</script>
<div id="research_main">
<div id="leftside">
<div class="singleone" id="fristarea">
<h3>视频芯片技术</h3>
<p id="txtdesc">针对芯片技术进行显示和处理，以高科技的发展适应现代的发展需要</p>
</div>
</div>
<div id="middlesile">
<img id="telogyimg" src="default.jpg"/>
</div>
<div id="rightsile">
<div class="singleone" id="vedioarea">
<h3>视频芯片技术</h3>
<p>针对芯片技术进行显示和处理，以高科技的发展适应现代的发展需要</p>
</div>
</div>
</div>
</body>
</html>
1147
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
