- it
- 【第四章】我的开心小农场
<!DOCTYPE html
>
<html
>
<head
>
<meta charset
="utf-8">
<title
>我的开心小农场
</title
>
<script language
="JavaScript" src
="js/jquery-1.11.1.min.js"></script
>
</head
>
<body
>
<script src
="../js/jquery-1.11.1.min.js"></script
>
<script src
="../js/jquery.pngFix.js"></script
>
<script src
="../js/jquery.pngFixFix.pack.js"></script
>
<script type
="text/javascript">
$(document
).ready(function(){
$("#bg").pngFix();
});
</script
>
<div id
="bg">
<span id
="seed"></span
>
<span id
="grow"></span
>
<span id
="bloom"></span
>
<span id
="fruit"></span
>
</div
>
<script type
="text/javascript">
$(document
).ready(function(){
$("#seed").bind("click",function(){
$("#temp").remove();
$("#bg").prepend("<span id='temp'><img src='images/seed.png'/></span>");
});
$("#grow").bind("click",function(){
$("#temp").remove();
$("#bg").append("<span id='temp'><img src='images/grow.png'/></span>");
});
$("#bloom").bind("click",function(){
$("#temp").replaceWith("<span id='temp'><img src='images/bloom.png'/></span>");
});
$("#fruit").bind("click",function(){
$("<span id='temp'><img src='images/fruit.png'/></span>").replaceAll("#temp");
});
$("#seed,#grow.#bloom,#fruit").bind("click",function(){
$("#temp").pngFix();
$("#temp").css({"position":"absolute","top":"85px","left":"195"});
});
});
</script
>
</body
>
</html
>
