Floating DIV based on JQuery displays prompt information and automatically hides it_jquery

复制代码 代码如下:

/**
* Floating DIV regularly displays prompt information, such as operation success, failure, etc.
* @param string tips (content of the tip)
* @param int height The height of the displayed information from the top of the browser
* @param int time displayed time (in seconds), time > 0
* @sample Click
* @sample The above code indicates that the operation is successful for 3 seconds after clicking, 100px from the top
* @copyright ZhouHr 2010-08-27
*/
function showTips( tips, height, time ){
var windowWidth = document.documentElement.clientWidth;
var tipsDiv = '

' tips '

';

$( 'body' ).append( tipsDiv );
$( 'div.tipsClass' ).css({
'top' : height 'px',
'left' : ( windowWidth / 2 ) - ( tips.length * 13 / 2 ) 'px',
'position' : 'absolute',
'padding' : '3px 5px',
'background': '#8FBC8F',
'font-size' : 12 'px',
'margin' : '0 auto',
'text-align': 'center',
'width' : 'auto',
'color' : '#fff',
'opacity' : '0.8'
}).show();
setTimeout( function(){$( 'div.tipsClass' ).fadeOut();}, ( time * 1000 ) );
}