gpt4 book ai didi

javascript - 水平滑动使用jquery ui

转载 作者:行者123 更新时间:2023-11-30 09:36:30 24 4
gpt4 key购买 nike

我需要让一个 div 消失在左边,让第二个 div 从右边出现。我正在使用以下 jquery UI 函数来执行此操作:

hide("slide", { direction: "left" }, 1000);
show("slide", { direction: "right" }, 1000);

我遇到的问题是第一个和第二个 div 在消失和进入时没有对齐,正如您在这个 fiddle 中看到的那样:

https://jsfiddle.net/oagxfpru/

我想让第二个div在进入场景时处于相同的高度。

有什么想法吗?感谢您的帮助<3

最佳答案

$(document).ready(function() {
$("#second").hide();

$("#toSecond").on('click', function() {
$("#first").hide("slide", { direction: "left" }, 1000);
$("#second").show("slide", { direction: "right" }, 1000);
});

$("#toFirst").on('click', function() {
$("#second").hide("slide", { direction: "left" }, 1000);
$("#first").show("slide", { direction: "right" }, 1000);
})
});
#first{float:left;
width:100%;}
#second{width:100%;}
<body>
<div id='first'>
Some content here<br/>
that should slide to the left<br/>
No problem with that
<input type="button" id="toSecond" value="to second">
</div>
<div id='second'>
This should be at the same height<br/>
then the first div when sliding to the left<br/>
This ain't working properly :/
<input type="button" id="toFirst" value="to first">
</div>

<script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js" integrity="sha256-T0Vest3yCU7pafRw9r+settMBX6JkKN06dqBnpQ8d30=" crossorigin="anonymous"></script>
<script type="text/javascript" src="test.js"></script>
</html>

关于javascript - 水平滑动使用jquery ui,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43250580/

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