jQuery Text Crossfade

Question

jQuery Text Crossfade

我知道各种图像交叉淡入淡出插件,但我需要交叉淡入淡出文本.就像,我在a,a或元素中有文本A,我希望它消失,而渐渐消失,B取代它.

任何帮助真的很感激.

Answer 1

这里快速演示.

 <html>    
   <head>
   <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script>
   <script type="text/javascript">
      $(function() {
            $('#test').fadeOut(2000);
            $('#test1').fadeIn(2000);
      });
    </script>
    <style>
       h1 {font-size:12em;position:absolute; left:0;top:0}
       #test1 {display:none}
    </style>
    </head>
    <body>
       <h1 id="test">A</h1> 
       <h1 id="test1">B</h1>
    </body>
    </html>

Run Code Online (Sandbox Code Playgroud)

对提问者的精彩服务,但不是如此.快速演示的链接应该伴随答案,而不是答案. (18认同)
而且你是谁的评委和陪审团 (2认同)

Answer 2

Kan*_*ann 5

非常简单的例子

<div>
<div style="position:absolute;" id="div1">Hello</div>
<div style="position:absolute;" id="div2">World</div>
</div>

<script>
        $("#div2").hide( );
        $("#div2").fadeIn( 3000 );
        $("#div1").fadeOut( 3000 );
</script>

Run Code Online (Sandbox Code Playgroud)

@Matt:事实上,`fadeIn`接受一个`回调`,因此你不需要'延迟'. (2认同)

归档时间：	16 年，7 月前
查看次数：	7239 次
最近记录：	14 年，1 月前