我在 div id myimage 下有一张图片。现在我想通过使用更改来调整它的大小。我想从选择框中选择 700X7000,然后图像的大小将是高度 700 像素和宽度 700 像素。无需重新加载页面。谁能帮助我我该怎么做?
问问题
97511 次
4 回答
31
好吧,要更改它,您只需设置图像的width()
and height()
:
$('#myimage').width(700); // Units are assumed to be pixels
$('#myimage').height(700);
因此,如果您要制作下拉框,您只需将值设置为、 等,100x100
然后选择值来提取尺寸:200x200
split
var parts = '100x100'.split('x');
var width = parseInt(parts[0], 10); // 10 forces parseInt to use base 10
var height = parseInt(parts[1], 10);
于 2011-07-01T16:54:13.720 回答
6
条件是您可以说选择的项目。
if( condition ) {
$('div#myimage img').css({'width' : '700px' , 'height' : '700px'});
}
else {
$('div#myimage img').css({'width' : '150px' , 'height' : '150px'});
};
以下是检查该框是否被选中的方法:
// First way
$('#checkBox').attr('checked');
// Second way
$('#checkBox').is(':checked');
示例工作:
if( $('#checkBox').attr('checked') ) {
$('div#myimage img').css({'width' : '700px' , 'height' : '700px'});
}
else {
$('div#myimage img').css({'width' : '150px' , 'height' : '150px'});
};
于 2011-07-01T17:08:05.873 回答
1
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function () {
$("#photograph").click(function () {
$("img").animate({
height: '+=5px',
width: '+=5px'
});
});
});
}
</script>
</head>
<body>
<div>
<img src="photo/grass.jpg" id="photograph" style="width:304px;height:228px;"/>
</div>
</body>
</html>
于 2015-09-04T08:56:25.247 回答
0
或者
函数发送对象
<img onLoad="ozhpixel(this)"
function ozhpixel(imaj){
$(imaj).width(100); // Units are assumed to be pixels
$(imaj).height(50);}
于 2014-10-28T09:37:11.040 回答