<!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=utf-8" />
<title>无标题文档</title>
<style type="text/css"></style>
<script type="text/javascript">
window.onload = function()
{
var img = document.getElementById("img");

function zengda()
{
img.width = img.width * 2;
img.height = img.height * 2;
img.onclick = jianxiao;
}

function jianxiao()
{

img.width = img.width / 2;
img.height = img.height / 2;
img.onclick = zengda;
}

img.onclick = zengda;


}
</script>
</head><body> <img src="images/img.png" id="img" />
</body>
</html>
代码如上,是一个当连续点击图片图片的大小随着单击的次数切换的而变大或者变小的代码,问题是当第一次变大后,第二次单击为什么只有宽度减小? 高度不减小呢? 我真是百思不得其解啊 请朋友们帮忙 谢谢!!!!!!!!!!!!!!!!

解决方案 »

  1.   

    <!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=utf-8" />
    <title>无标题文档</title>
    <style type="text/css"></style>
    <script type="text/javascript">
    window.onload = function()
    {
    var img = document.getElementById("img");
    function zengda()
    {
    img.width = img.width * 2;
    if(img.getAttribute("first")=="f"){
    img.height = img.height;
    }else{
    img.height = img.height*2;
    }
    img.onclick = jianxiao;
    }function jianxiao()
    {
    img.setAttribute("first","m");
    img.width = img.width / 2;
    img.height = img.height /2;
    img.onclick = zengda;
    }img.onclick = zengda;}
    </script>
    </head><body><img src="1.jpg" first="f" id="img" />
    </body>
    </html>
    这样试试