Question

我想使用jQuery从右向左滑动隐藏的（first_tag）div块。当用户在此块上悬停时，它应该出现。这是代码：

display:none

此代码工作正常，但它从左向右滑动，我希望它从右向左滑动。我怎么能'逆转'呢？

Answer 1

动画使元素的width发生变化，当它以通常的方式定位时，它会向左侧缩小（想一想：如果它达到50％，你的块会在哪里结束？ width？）。您可以使用div以另一种方式定位float: right;，在这种情况下，它会缩小到右侧。

以下是一个说明这一点的摘录：

window.toggle = function() {
	jQuery(".toggledOne, .toggledAnother").stop(true, true).animate({width:'toggle'}, 400);
}

.wrapper,
.toggledOne,
.toggledAnother {
    width: 100%;
}

.wrapper {
    height: 2em;
}
.toggledOne,
.toggledAnother {
    height: 1em;
}
.toggledOne {
    background-color: red;
}

.toggledAnother {
    float: right;
    background-color: green;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<a onclick="window.toggle();">click me</a>
<div class="wrapper">
    <div class="toggledOne"></div>
    <div class="toggledAnother"></div>
</div>

在jQuery中从右到左动画宽度切换

1 个答案: