jQuery's的slideUp功能对我来说无法正常工作

jQuery's slideUp function not working properly for me

本文关键字：常工作 工作 对我来说 功能 slideUp jQuery      更新时间：2023-09-26

请看一下这把小提琴。

我的目标是有一个按钮，可以通过按钮远程向上滑动图像，但它会变小。

有人知道这是什么原因吗？

image元素正试图保持其纵横比，因为您只指定了height，而没有指定width。

添加width="200px"可以解决您的问题。你会在这里找到一把更新的小提琴。

您需要将图像放在设置了overflow: hidden的容器中，这样浏览器就不会调整图像本身的大小并导致纵横比失真。

HTML

<div class="le_map_container"> <!-- overflow: hidden on this element -->
    <img src="http://bethhaim.spin-demo.com/wp-content/files_flutter/1330095469Untitled-5.jpg" height="200" class="le_map"/>
</div>

jQuery

$('.tour_map').click(function() {        
    $(".le_map_container").slideToggle();
});

小提琴示例

slideToggle方法更改元素的高度。但我认为，因为你直接滑动图像标签，宽度会随着高度的变化而变化，以保持比例。

尝试明确设置图像的宽度。

DEMO

相关文章：