Twitter like status message using jquery_问答_开发者

Twitter like status message using jquery

开发者 https://www.devze.com 2023-01-04 02:32 出处：网络

I am using this jquery javascript function to show status message, function topBar(message) { $(\"<div />\", { \'class\': \'topbar\', text: message }).hide().prependTo(\"body\")

I am using this jquery javascript function to show status message,

function topBar(message) {
  $("<div />", { 'class': 'topbar', text: message }).hide().prependTo("body")
      .slideDown('fast').delay(4000).slideUp(function() { $(this).remove(); });
}

开发者_如何学运维

and my css:

.topbar { 
    background: #476275; 
    border-bottom: solid 2px #EEE; 
    padding: 3px 0; 
    text-align: center; 
    color: white;
    font-family:Arial,Helvetica,sans-serif;
    font-size:135%;
    font-weight:bold;
}

I am getting my status message but what it does it inserts a div within the body tag instead i want the message to display out of the body(z index) exactly like twitter (ie) just flow my message from top and hide it... Any suggestion.... Hope you got my question..

Do you want something like this?

http://tympanus.net/codrops/2009/10/29/jbar-a-jquery-notification-plugin/

If you download the plugin you can change the speed of the fade in/out by amending lines 28 (for fade in) and 39 (for fade out) from fast to slow

e.g

line 28 _wrap_bar.append(_message_span).append(_remove_cross).hide().insertBefore($('.content')).fadeIn('slow');

line 39

$('.jbar').fadeOut('slow',function(){

you can't insert an item before the <body> tag--your content needs to be within that, so you should probably have a container element surrounding all of the other elements that you can prepend the message to