Append 后如何使用 fadein淡入效果

2017-07-06  本文已影响0人  Chris_monster

<script src="https://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
<style>
{margin:0; padding:0;}
.btn{ display:block; width:100px; line-height:20px; text-align:center; background:#9CF; color:#F93;}
.d1{ width:100px; height:500px; border:1px solid #cccccc; margin-bottom:20px;}
.d1 p{ line-height:30px; text-align:center; cursor:pointer;}
.d2{width:100px; height:500px; border:1px solid #cccccc; margin-bottom:20px;}
/
.d2 p{ opacity:0;}*/
.cur{ background-color:#CC99CC;}
</style>

<body>
<a href="javascript:;" class="btn">点击添加</a>
<div class="d1">

      &lt;p >清白之年0 </p>
       &lt;p>清白之年1</p>
      &lt;p>清白之年2</p>
      &lt;p>清白之年3</p>
</div>
<div class="d2">
</div>
<script>
    $(".d1 p").click(function(){
        $(this).addClass("cur").siblings().removeClass("cur")
        })
    $(".btn").click(function(){
        var text=$(".cur").text()
        var $p=$('&lt;p>'+text+'</p>')
        $(".d2").append($p.hide().fadeIn(300))
        })
</script>

</body>

摘自:http://www.cnblogs.com/lovebing/p/6649973.html

Append 后如何使用 fadein淡入效果

Append 后如何使用 fadein淡入效果
Append 后如何使用 fadein

先隐藏才能显示!代码如下:
$('ul.getlist').append(list).hide().fadeIn('slow');
list 是已经处理好要拼接的内容
仔细研究之后:
$('ul.getlist').append($(list).hide().fadeIn(1000));
这样做才是最好的!
或者用这种:
$('#thumbnails').append('<listyle="display:none"><imgsrc="/photos/t/'+data.filename+'"/></li>').children(':last').hide().fadeIn(2000);

上一篇下一篇

猜你喜欢

热点阅读