用onresize="changeimg()"，事件写一个js脚本，使图片能随浏览器大小变化而变化。
2个回答
展开全部
<script>
var maxWd = window.innerWidth;
var maxHt = window.innerHeight;
function res() {
$("#image").width($("#image").width() * window.innerWidth / maxWd);
$("#image").height($('#image').height() * window.innerHeight / maxHt);
maxWd = window.innerWidth;
maxHt = window.innerHeight;
}
</script>
</head>
<body onresize="res()">
<div>
<img src="1.jpg" id="image" style="width:400px;height:300px"/>
</div>
</body>
var maxWd = window.innerWidth;
var maxHt = window.innerHeight;
function res() {
$("#image").width($("#image").width() * window.innerWidth / maxWd);
$("#image").height($('#image').height() * window.innerHeight / maxHt);
maxWd = window.innerWidth;
maxHt = window.innerHeight;
}
</script>
</head>
<body onresize="res()">
<div>
<img src="1.jpg" id="image" style="width:400px;height:300px"/>
</div>
</body>
追问
话说朋友很好的方法啊，但是能不能加个刷新啊？浏览器变化窗口不刷新，图片无法正常显示啊，
追答
你说的窗口不刷新是指？具体点
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
//宽度 高度 可以根据浏览器的宽度高度 自己定义规则去算
//网页可见区域宽： document.body.clientWidth
//网页可见区域高： document.body.clientHeight
//网页可见区域宽： document.body.offsetWidth (包括边线的宽)
//网页可见区域高： document.body.offsetHeight (包括边线的高)
//网页正文全文宽： document.body.scrollWidth
//网页正文全文高： document.body.scrollHeight
//网页被卷去的高： document.body.scrollTop
//网页被卷去的左： document.body.scrollLeft
//网页正文部分上： window.screenTop
//网页正文部分左： window.screenLeft
//屏幕分辨率的高： window.screen.height
//屏幕分辨率的宽： window.screen.width
//屏幕可用工作区高度： window.screen.availHeight
//屏幕可用工作区宽度： window.screen.availWidth
var changeimg = function () {
var w = document.body.clientWidth;
var h = document.body.clientHeight;
var img = document.getElementById("图片ID");
img.style.width = "";
img.style.height = "";
}
window.onresize = function () {
changeimg();
}
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
