Не нравятся результаты поиска? Попробуйте другой поиск!
dle-faq.ru FAQ (все вопросы) Общие вопросы Можно ли привязать к каждому элементу на веб странице свой таймер?

Можно ли привязать к каждому элементу на веб странице свой таймер?


     13.12.2014    Общие вопросы, jQuery    1051

вопрос
Хочу разработать свою систему всплывающих подсказок. Всё сделал, открытие, закрытие, но только не могу догадаться, как можно к каждой всплывающей подсказке привязать свой таймер, чтоб по истечении например 5 секунд подсказка сама закрывалась, и если на нее наведешь курсор, то таймер сбросится. Вот код создания подсказки:


  add: function(params){
    var title = params.title ? params.title : '';
    var text = params.text ? params.text : '';
    
    var tpl = "<div class='growl'><div class='content'><div class='title'>"+title+"</div><div class='text'>"+text+"</div></div></div>";
    
    $("#growl_area").prepend(tpl);

    $('#growl_area .growl:hidden').animate({
      opacity:'show',
      height:'show',
    },300,function(){

     //Подсказка создана
      
    });

  }


Поднакиньте пожалуйста вариантов, а то уже голову всю сломал, никак не могу догадаться :) У меня получалось сделать такое только для одной подсказки, так как я знал её ID и ставил таймер сразу же после подключения.

Ответа пока нет


Комментарии пользователей (16)

FastFud
50

1599 | 588

FastFud - 13 декабря 2014 15:43 - Юзер

$('#growl_area .growl:hidden').animate({
        opacity:'show',
        height:'show'
    }, 300, function(){ //Подсказка создана
        if (!$('#growl_area .growl:hover')) {
            setTimeout(function (){
                $('#growl_area .growl').fadeOut();
            }, 5000);
        }
});

vk_159926832
206 | 5

vk_159926832 - 13 декабря 2014 16:32 - Юзер

Сделал немного по другому, принцип вроде такой-же, но закрывается только последнее уведомление


  add: function(params){
    var title = params.title ? params.title : '';
    var text = params.text ? params.text : '';
    
    var tpl = "<div class='growl'><div class='content'><div class='title'>"+title+"</div><div class='text'>"+text+"</div></div></div>";
    
    $("#growl_area").prepend(tpl);

    $('#growl_area .growl:hidden').animate({
      opacity:'show',
      height:'show',
    },300,function(){

            $elm = $(this);

            setTimeout(function (){
             $growl.close($elm);
            }, 5000);
      
    });

}

Подскажите что может еще быть?

vk_159926832
206 | 5

vk_159926832 - 14 декабря 2014 12:58 - Юзер

Помогите ктонибудь пожалуйста!

FastFud
50

1599 | 588

FastFud - 14 декабря 2014 13:01 - Юзер

Дайте полный код и с примером, как работает.

vk_159926832
206 | 5

vk_159926832 - 14 декабря 2014 14:03 - Юзер


FastFud
50

1599 | 588

FastFud - 14 декабря 2014 15:13 - Юзер


vk_159926832
206 | 5

vk_159926832 - 14 декабря 2014 15:53 - Юзер

у вас там нет скрипта

vk_159926832
206 | 5

vk_159926832 - 15 декабря 2014 16:05 - Юзер

помогите пожалуйста

FastFud
50

1599 | 588

FastFud - 16 декабря 2014 01:59 - Юзер

у вас там нет скрипта
Прошу прощения, наверное моя вина) Вот другой пример

vk_159926832
206 | 5

vk_159926832 - 16 декабря 2014 12:12 - Юзер

ничего страшного) спасибо вам) а не подскажите как можно сделать, чтоб при наведении на подсказку она не убиралась и таймер её обнулялся?

FastFud
50

1599 | 588

FastFud - 16 декабря 2014 18:03 - Юзер

Попробуйте, через mouseover или hover.

vk_159926832
206 | 5

vk_159926832 - 17 декабря 2014 13:29 - Юзер

Так а как мне узнать какой таймер обнулять?

FastFud
50

1599 | 588

FastFud - 17 декабря 2014 14:24 - Юзер


vk_159926832
206 | 5

vk_159926832 - 17 декабря 2014 17:50 - Юзер

Так у вас таймер один и привязан к квадрату. А там же у меня много будет элементов.

FastFud
50

1599 | 588

FastFud - 17 декабря 2014 17:52 - Юзер

Используйте лучше другие, готовы плагины, и не тратьте время на создание новых.

vk_159926832
206 | 5

vk_159926832 - 17 декабря 2014 19:07 - Юзер

Просто, видите, хочется создать свой проект, с нуля. Чтоб набраться знаний и опыта. Делаю для себя, чтоб было удобно мне его интегрировать, чтоб он был для меня гибкий и многофункциональный, без лишнего. А в плагинах много лишнего бывает, и бывает некоторые интегрируются муторно. А какие плагины таких подсказок вы посоветуете?

Чтобы комментировать - войдите или зарегистрируйтесь на сайте

Похожие вопросы