jquery - 如果宽度 > 某些 jquery，则调整所有图像的大小

Question

如果宽度>例如400px，我想调整页面中所有图像的大小

我尝试使用此代码

 var img_width =  $("#my_img").width();
//alert(img_width)
if(img_width > 380){
 $("#my_img").width('380');
}

但没有任何工作，在页面上我有超过 10 张图片 ti 有 id my_img

img 标签

img src='tttttt.jpg' id="my_img"

我如何调整它的大小？

因为我有一个模板，我不希望 img 的宽度超过 400px

Answer 1

你不能为此使用CSS吗？

max-width:400px;

就像代达罗斯所说，在一个文档中多次使用相同的 id 是无效的 html。

Answer 2

<script>
    jQuery(document).ready(function(){
        jQuery(".my_img").each(function(e){
            if(e.width()>380){
                jQuery(this).attr('width','380');
            }
        });
    });
</script>

Answer 3

首先，有多个相同的项目是无效的 html id。正如我在上面的评论中所说，使用 aclass代替。

假设您的 html 如下所示：

<img class="my_img" src="someurl" style="width: 390px;" />
<img class="my_img" src="someurl" style="width: 390px;" />
<img class="my_img" src="someurl" style="width: 390px;" />
<img class="my_img" src="someurl" style="width: 340px;" />

以下 jquery 将调整前三个图像的大小，前提是它们匹配相应的规则：

$(document).ready(function() {
    $('.my_img').each(function(index,value) {
        if ($(value).width() > 380) {
            $(this).css('width', 380);
        }
    });
});​