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

IamJackYan 2017-09-21 08:37:20

<!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";
图片的大小就可以改变了。
...全文
199 5 打赏 收藏 转发到动态 举报
写回复
用AI写文章
5 条回复
切换为时间正序
请发表友善的回复…
发表回复
天际的海浪 2017-09-23
  • 打赏
  • 举报
回复
var wid=document.getElementById("pic").offsetWidth;
Go 旅城通票 2017-09-22
  • 打赏
  • 举报
回复
    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的用法及区别
当作看不见 2017-09-22
  • 打赏
  • 举报
回复
img标签 没有width 和height 属性 ,设置宽和高需要通过样式.style.width 和style.height来实现 canvas 倒是支持width 和height ;表示canvas像素点的多少(不会改变canvas的视觉大小,改变的是canvas里面的像素点),而设置canvas 的style.width和style.height(会改变视觉大小,但是里面的图形会变模糊,像素点的数量没变)
5年的老菜鸟 2017-09-22
  • 打赏
  • 举报
回复
document.getElementById("pic").style.width=wid+5+"px"; 这行代码 wid 有问题
hongmei85 2017-09-21
  • 打赏
  • 举报
回复

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

87,910

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧