弹窗的淡入淡出

var sendMsgTip = function(className,$event){
                $event.stopPropagation();
                $(className).stop(true,true).fadeIn(500);
                $(className).stop(true,true).delay(2000).fadeOut(1000);
                if (!$scope.$$phase) {
                    $scope.$apply();
                }
            }

 HTML:

<!--添加定时短信息提示信息弹层 -->
    <div class=" add-timer-tips"style="display: none;" >
        <i class="icon_three prompt-tips-icon" ></i>
        <span class="add-text-message">定时时间已过期</span>
    </div>

项目中碰到一个小bug,就是创建一个弹窗,然后点击时候触发,然后多次点击弹窗多次出现;需求是多次点击按钮只是显示最后一次的弹窗;以上使用的就是

jQuery里的stop方法解决的;淡入淡出;

2.弹窗的另一个方法;

var newsTips = {    content: '消息内容不能为空'};
function showErrorTip(tip) {
$('.newsTips').text(tip);
$('.newsTips').fadeIn();
$timeout(function(){ //angularjs
$('.newsTips').fadeOut(1500);
if (!$scope.$$phase) {
$scope.$apply();
}
}, 2000);
}
 
原文地址:https://www.cnblogs.com/sxz2008/p/6639107.html