现在的位置: 首页 > 综合 > 正文

javaScript—图片渐显效果和文字大小变化之鼠标响应事件

2013年06月27日 ⁄ 综合 ⁄ 共 2679字 ⁄ 字号 评论关闭

<!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 type="text/JavaScript">
<!--
function MM_popupMsg(msg) { //v1.0
  alert(msg);
}
function makevisible(cur,which){
if(which==0)
 cur.filters.alpha.opacity=100;
else
 cur.filters.alpha.opacity=20;

}

//not to use the button :2
function nouseleft(){
 if(event.button==2)
  alert("what do you want to do...");
}
document.onmousedown=click();
function test(){
 var str=/d{3};
 document.form3.value=str;
}

//-->
</script>
<style type="text/css">
<!--
#Layer1 {
 position:absolute;
 left:137px;
 top:88px;
 width:257px;
 height:116px;
 z-index:1;
}
-->
</style>
</head>

<body>
<div id="Layer1">
  <form  id="form3"  name="form3" method="post" action="">
    <label>正则表达式测试
      <input  type="text" name="textfield" />
    </label>
  </form>
</div>
<a onmouseover="MM_popupMsg('Hello.I/'m wuqifeng...')">Are you studip...</a>
<center>
<form name="form1">
<h1>put the foucs on the link and to look over the web...</h1>
<a href="second.html" name="link1" onmouseover="link1over()" onmouseout="link1out()">this is the first link.</a><br>
<br>
<a href="third.html" name="link2" onmouseover="link2over()"onmouseout="link2out()">this is the second link.</a><br>
<br>
<a href="third.html" name="link3" onmouseover="link3over()"onmouseout="link3out()">this is the third link.</a><br>
<br>
<a href="fourth.html" name="link4" onmouseover="link4over()"onmouseout="link4out()">this is the fourth link.</a><br>
<br>
<img name="img1" src="image/1.jpg" style="filter:alpha(opacity=20)"
onmouseover="makevisible(this,0)" onmouseout="makevisible(this,1)" >
</form>
<form id="form2" name="form2" method="post" action="">
</form>

<p>&nbsp;</p>
</center>

</body>
<script language="javascript">
<!--
function link1over(){
 document.form1.img1.src="image/1.jpg";
 link1.style.color="red";
 link1.style.fontSize=36;
}
function link2over(){
 document.form1.img1.src="image/2.jpg";
 link2.style.color="red";
 link2.style.fontSize=36;
}
function link3over(){
 document.form1.img1.src="image/3.jpg";
 link3.style.color="red";
 link3.style.fontSize=36;
}
function link4over(){
 link4.style.color="red";
 link4.style.fontSize=36;
 document.form1.img1.src="image/4.jpg";
}

function link1out(){
 document.form1.img1.src="image/1.jpg";
 link1.style.color="black";
 link1.style.fontSize=16;
}
function link2out(){
 document.form1.img1.src="image/2.jpg";
 link2.style.color="black";
 link2.style.fontSize=16;
}
function link3out(){
 document.form1.img1.src="image/3.jpg";
 link3.style.color="black";
 link3.style.fontSize=16;
}
function link4out(){
 link4.style.color="black";
 link4.style.fontSize=16;
 document.form1.img1.src="image/4.jpg";
}

 

//-->
</script>
</html>
 

抱歉!评论已关闭.