jquery动画不同的img宽度
我已经寻找答案很长时间了，但没有结果，所以是时候问一下了。 我正在尝试使用 .animate() 来更改单击后图像的大小。图像的第一个状态是缩略图大小，它会动画到图像的原始大小，然后再次动画到缩略图。
编辑：默认情况下，图像加载宽度为 150px。
问题是，并非所有图像都具有相同的“原始”大小，因此我需要一种方法来告诉一个通用函数切换到当前图像的原始大小。
这是我当前在 $(window).load: 上加载的代码：
$('img[class=resize]').click(function (){
if ($(this).width() != 150)
{
$(this).animate({width: '150px'}, 400);
}
else
{
$(this).animate({width: ''}, 400);
}
});
现在这显然不能按我想要的方式工作，因为 .animate() 当我说 width: ' 时会思考' 我想让宽度= 0。有什么建议我应该如何解决这个问题吗？
I've been searching for an answer for a long time with no avail, so it's time to ask.
I'm trying to use .animate() to change the size of an image once clicked. The first state of the image would be a thumbnail size, which would animate to the image's original size, then to a thumbnail again.
edit: images load with 150px width by default.
The problem is, not all the images have the same "original" size so I need a way to tell one generic function to switch to the current image's original size.
This is my current code which loads on $(window).load:
$('img[class=resize]').click(function (){
if ($(this).width() != 150)
{
$(this).animate({width: '150px'}, 400);
}
else
{
$(this).animate({width: ''}, 400);
}
});
Now this obviously doesn't work the way I want it, because .animate() thinks when I say width: '' I want to make the width = 0. Any suggestions how I should go about this?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
这是一个想法：当您将图像写入页面时，添加一个类或一些其他属性，即图像的原始宽度，然后当您将其动画恢复到其原始大小时，尝试
$(this).animate({ width: $(this).attr('original_size_attribute_of_your_choosing')}, 400);tl,dr：将原始尺寸保存在每个图像的属性中。
Here's an idea: When you write an image to the page, add a class or some other attribute that is the image's original width, then when you animate it back to its original size, try
$(this).animate({width: $(this).attr('original_size_attribute_of_your_choosing')}, 400);tl,dr: save the original size in an attribute of each image.