Copy codeThe Code is as follows:
<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 ('Alas, no'); // the disappearance of the image
});
})
$ ('# Button2'). bind ('click', function (){
$ ('Img '). fadeIn (2000, function (){
$ ('# Button2'). val ('with'); // Image Rendering
});
})
$ ('# Button3'). bind ('click', function (){
$ ('Img '). fadeTo (2000, 0.3, function (){
Alert ('animation execution Terminal'); // picture transparency
});
})
$ ('# Select1'). bind ('change', function () {// It can be a change or click event.
$ ('Img '). fadeTo (1000, $ (' # Select1 option: selected'). val ());
})
})
</Script>
</Head>
<Body>
<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>