gpt4 book ai didi

javascript - Picasa:自动更改站点中的图像大小

转载 作者:搜寻专家 更新时间:2023-10-31 23:06:26 25 4
gpt4 key购买 nike

我将我网站的图片保存在 Picasa 中...据我们所知,我们可以像这样设置图片的大小。

http://lh5.ggpht.com/-i97UI0TXchE/UatpZd-E3tI/AAAAAAAAAFg/HUu-QK63ce0/w900-h0/running-sml.jpg

w900-h0 部分表示,图片尺寸为:width 900px,height 0(自动)。

所以我需要根据设备的视口(viewport)自动更改图像的这个 url(实际上是 w900-h0 部分),我知道我可以让图像流畅,只需将它们设置为最大-宽度:100%;通过 css,但在那种情况下,图片的尺寸并没有变小,只是视觉上变小了。

我如何通过 java 脚本更改 w900-h0 部分,例如当视口(viewport)为 480 时更改 url w300-h0 等等。

最佳答案

document.ready 状态下,您可以使用类似这样的方法来更改图像宽度:

imageWidth = $(window).width();
$("#my_image").attr("src","http://lh5.ggpht.com/-i97UI0TXchE/UatpZd-E3tI/AAAAAAAAAFg/HUu-QK63ce0/w"+imageWidth+"-h0/running-sml.jpg");

函数 $(window).resize() 也有助于动态调整大小。

更新:

如果您想对多张图片执行此操作:

imageWidth = $(window).width();
$(".imageForResize").each(function() {
$(this).attr("src", $(this).attr('src').replace('w900-h0', 'w'+imageWidth+'-h0'));
});

Example on JSFiddle

关于javascript - Picasa:自动更改站点中的图像大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16884549/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com