使用jquery更改图像尺寸

DAK*_*KSH 6 jquery resize image image-size

我在div id myimage下有一个图像.现在我想通过使用更改来调整它的大小.我想从选择框700X7000选择框然后图像的大小将是高度700px和宽度700px.没有重新加载页面.任何人都可以帮我,我该怎么做?

Ble*_*der 28

好吧,要改变它,你可以设置图像width()height():

$('#myimage').width(700); // Units are assumed to be pixels
$('#myimage').height(700);
Run Code Online (Sandbox Code Playgroud)

所以,为你做的下拉框,你可以设置的值:是这样的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);
Run Code Online (Sandbox Code Playgroud)


use*_*728 6

条件是您可以说选择的项目.

if( condition ) {
   $('div#myimage img').css({'width' : '700px' , 'height' : '700px'});
}
else {
   $('div#myimage img').css({'width' : '150px' , 'height' : '150px'});
};
Run Code Online (Sandbox Code Playgroud)

以下是检查框是否被选中的方法:

// First way 
$('#checkBox').attr('checked'); 

// Second way 
$('#checkBox').is(':checked'); 
Run Code Online (Sandbox Code Playgroud)

工作示例:

if( $('#checkBox').attr('checked') ) {
   $('div#myimage img').css({'width' : '700px' , 'height' : '700px'});
}
else {
   $('div#myimage img').css({'width' : '150px' , 'height' : '150px'});
};
Run Code Online (Sandbox Code Playgroud)