Твиттер как сообщение о статусе с использованием jquery

Я использую эту функцию jquery javascript, чтобы показать сообщение о состоянии,

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

и мой 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;
}​

Я получаю свое сообщение о статусе, но для этого он вставляет div в тег body, вместо этого я хочу, чтобы сообщение отображалось вне тела (индекс z) точно так же, как твиттер (то есть), просто передавал мое сообщение сверху и скрывал его. Любое предложение.... Надеюсь, вы получили мой вопрос..

2 ответа

Решение

Вы хотите что-то подобное?

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

Если вы скачали плагин, вы можете изменить скорость постепенного исчезновения, изменив строки 28 (для постепенного появления) и 39 (для постепенного исчезновения) из fast в slow

например

строка 28_wrap_bar.append(_message_span).append(_remove_cross).hide().insertBefore($('.content')).fadeIn('slow');

линия 39

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

Вы не можете вставить элемент до <body> тег - ваш контент должен быть внутри этого, поэтому у вас, вероятно, должен быть элемент контейнера, окружающий все остальные элементы, к которым вы можете добавить сообщение

Другие вопросы по тегам