元素淡入淡出效果实现

html代码：

 

 <div class="aui-list-item-title loadcheck" v-bind:data-id="item.JianChaID">

                </div>
                <section v-bind:data-id="item.JianChaID" class="aui-content sec ">        
                </section>

 

 js代码：

 1  //初始化事件
 2             initEvent: function () {
 3 
 4                 var that = this;
 5                 $('#ullist').delegate('div.loadcheck', 'click', function () {
 6 
 7                     var ckid = $(this).attr("data-id");
 8                     that.loadCheckDetail(ckid);
 9                     var lastshow = that.lastshow;
10                     var obj = $('section[data-id="' + ckid + '"]');
11                     if (!lastshow) {
12                         obj.fadeIn(300);
13                         that.lastshow = ckid;
14                         return;
15                     }
16 
17                     if (lastshow == ckid) {
18                         obj.fadeOut(200);
19                         that.lastshow = '';
20                         return;
21                     }
22 
23                     $('section[data-id="' + lastshow + '"]').fadeOut(200, function () {
24                         obj.fadeIn(300);
25                         that.lastshow = ckid;
26                     });
27 
28                 });
29             },

 

转载于:https://www.cnblogs.com/yaphetsfang/p/9269201.html