js操作效果之showTips与createBg

来源:互联网 发布:android 仿淘宝搜索 编辑:程序博客网 时间:2024/06/10 09:13
/** * 创建全屏透明背景层 * @param   id */function createBg (id) {    $('<div id = "' + id + '"></div>').appendTo('body').css({        'width' : $(document).width(),        'height' : $(document).height(),        'position' : 'absolute',        'top' : 0,        'left' : 0,        'z-index' : 2,        'opacity' : 0.3,        'filter' : 'Alpha(Opacity = 30)',        'backgroundColor' : '#000'    });}/**操作成功效果**/function showTips(tips,time,height){    var windowWidth = $(window).width();height=height?height:$(window).height();    time = time ? time : 1;    var tipsDiv = '<div class="tipsClass">' + tips + '</div>';    $( 'body' ).append( tipsDiv );    $( 'div.tipsClass' ).css({        'top' : height/2 + 'px',        'left' : ( windowWidth / 2 ) - 100 + 'px',        'position' : 'absolute',        'padding' : '3px 5px',        'background': '#670768',        'font-size' : 14 + 'px',        'text-align': 'center',        'width' : '300px',        'height' : '40px',        'line-height' : '40px',        'color' : '#fff',        'font-weight' : 'bold',        'opacity' : '0.8'    }).show();    setTimeout( function(){        $( 'div.tipsClass' ).animate({            top: height/2-50+'px'        }, "slow").fadeOut();    }, time * 1000);}