[英]Fade Div1 In/Out Then Fade Div2 In?
I'm trying to fade in the div "frame1" in while "frame2" is hidden, and then when "frame1" fades out I want "frame2" to fade in where "frame1" faded out. 我正在尝试在“ frame2”被隐藏的同时在div中“淡入”,然后当“ frame1”淡出时我希望“ frame2”在淡入“ frame1”时淡入。 I tried searching, but havent had luck since most that I have come across are onclick events.
我尝试搜索,但是还没有走运,因为我遇到的大多数都是onclick事件。
<div id="frames">
<div id="frame1">
<p>first text to appear here</p>
</div>
<div id="frame2">
<p>second text to appear here after first text fades out</p>
</div>
</div>
If frame1 is shown and frame2 is hidden, you can fadeout frame1 and then fadein frame2 by using this code: 如果显示了frame1并隐藏了frame2,则可以使用以下代码淡入frame1,然后淡入frame2:
$(document).ready(function(){
$("#frame1").fadeOut('slow', function(){
$("#frame2").fadeIn('slow');
});
});
Absolute position both divs relative to the wrapper div so they're superposed and then use the callback function from the fadeOut event in the first div. 两个div相对于包装div的绝对位置,以便它们重叠,然后在第一个div中使用fadeOut事件中的回调函数。
$('#frame1').fadeOut('fast', function(){
$('#frame2').fadeIn('fast'); // Callback
});
At first, frame 2 is hidden, then hiding frame 1 and showing frame 2 with this fade out fade in.. 首先,隐藏第2帧,然后隐藏第1帧并显示第2帧,其中此淡出淡入。
$("#frame1").fadeOut('slow', function(){
$("#frame2").fadeIn('slow');
});
using jQuery .fadeTo() 使用jQuery .fadeTo()
$('#frame1').fadeTo('slow', 1, function() {
$('#frame2').fadeTo(600, 0);
});
slow
and 600
(string or number in milliseconds) slow
和600
(字符串或数字,以毫秒为单位) 1
and 0
(number ranging from 0-1) 1
和0
(数字范围为0-1) or 要么
using jQuery .fadeIn() and .fadeOut() 使用jQuery .fadeIn()和.fadeOut()
$("#frame1").fadeOut('fast', function(){
$("#frame2").fadeIn(100);
});
fast
and 100
(string or number in milliseconds) fast
和100
(字符串或数字(以毫秒为单位)) $('#frame1').fadeOut('slow');
$('#frame2').delay('slow').fadeIn('slow');
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.