易网时代-编程资源站
易网时代-编程资源站 复制代码 代码如下:
<head>
<title></title>
<style type="text/css">
#img1
{
width:400px; height:500px;
}
</style>
<script src="jquery-1.9.1.js" type="text/javascript"></script>
<script type="text/javascript">
$（function （） {
$（"#Button1"）.bind（"click", function （） {
$（"img"）.fadeOut（2000, function （） {
$（"#Button1"）.val（"哎，没了"）; //图片的消逝
}）;
}）
$（"#Button2"）.bind（"click", function （） {
$（"img"）.fadeIn（2000, function （） {
$（"#Button2"）.val（"有了"）; //图片的呈现
}）;
}）
$（"#Button3"）.bind（"click", function （） {
$（"img"）.fadeTo（2000, 0.3, function （） {
alert（"画动执行终了"）; //图片透明度
}）;
}）
$（"#Select1"）.bind（"change", function （） { //可是以change或者是click事件
$（"img"）.fadeTo（1000, $（"#Select1 option:selected"）.val（））;
}）
}）
</script>
</head>
<body>
<img src="images/1.jpg" id="img1" />
<input id="Button1" type="button" value="button" />
<input id="Button2" type="button" value="button" />
<input id="Button3" type="button" value="button" />
<select id="Select1">
<option>1</option>
<option>0.1</option>
<option>0.2</option>
<option>0.3</option>
<option>0.4</option>
<option>0.5</option>
<option>0.6</option>
<option>0.7</option>
<option>0.8</option>
<option>0.9</option>
<option>0</option>
</select>
</body>