小白提问：用JS实现图片大小改变的不解


<!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>
<script language="javascript">
function func1()
{
var wid=parseInt(document.getElementById("pic").style.width);
        document.getElementById("pic").style.width=wid+5+"px";
}
</script>
</head><body>
<a href="#" onmousemove="func1()"><img src="image/1.jpg" width="300" height="200" id="pic" /></a>
</body>
</html>
当我用上面的代码时为什么图片的宽度没有改变？
但如果把函数func1里的代码改为
document.getElementById("pic").style.width=305+"px";
图片的大小就可以改变了。

解决方案 »

  1.   


    function func1()
    {
    var wid=parseInt(document.getElementById("pic").width);
    document.getElementById("pic").style.width=wid+5+"px";
    }
      

  2.   

        function func1() {
            var pic = document.getElementById("pic");
            var wid = parseInt(pic.style.width) || parseInt(pic.width);
            pic.style.width = wid + 5 + "px";
        }Web开发学习资料推荐
    javascript运行机制浅析
    JavaScript apply与call的用法及区别
      

  3.   

    document.getElementById("pic").style.width=wid+5+"px";   这行代码  wid 有问题
      

  4.   

    img标签 没有width 和height 属性 ,设置宽和高需要通过样式.style.width 和style.height来实现
    canvas 倒是支持width 和height ;表示canvas像素点的多少(不会改变canvas的视觉大小,改变的是canvas里面的像素点),而设置canvas 的style.width和style.height(会改变视觉大小,但是里面的图形会变模糊,像素点的数量没变)
      

  5.   

    var wid=document.getElementById("pic").offsetWidth;