Tooltip на jquery + php

Тема в разделе "Как сделать...", создана пользователем Sunday, 19 янв 2012.

  1. Sunday

    Sunday

    Регистр.:
    13 дек 2009
    Сообщения:
    724
    Симпатии:
    314
    Есть плагин.
    Есть функция
    Код:
        <script type="text/javascript">
            jQuery(function() {
                jQuery(".view-full-text").tooltip({
                bodyHandler: function(){
                    return jQuery("#tip")[0].innerHTML;
                }, track: true,
                  delay: 0,
                  showURL: false,
                  fade: 250
                });
            });
        </script>
    В цикле выводится список заголовков новостей. Работает так:
    при наведении на заголовок (view-full-text) всплывает окно с содержимым дива #tip
    Код (на синтаксис не смотрите, специально упростил для наглядности):
    PHP:
    while {
    <
    div id='tip' style="display:none">$fulltext</div>
    <
    a href='#' class='view-full-text'>Заголовок</a>
    }
    Лажа в том, что по всем заголовкам выводится один и тот же текст.
    Получается, что каждый див должен иметь уникальный ID, вот тут у меня и затык. Как определить диву уникальный ID - понятно, но как этот ID обозначить в функции, которая находится за пределами цикла?
    Или я заработался или дно из двух :(

    Помогите, кто чем может :)
     
  2. dino

    dino

    Регистр.:
    28 май 2009
    Сообщения:
    550
    Симпатии:
    204
    попробуйте использовать плагин easyTooltip, там достаточно в теле ссылки указать параметр tytle, в который ввести необходимый текст(или html).
    При наведении мышки на эту ссылку будет всплывать подсказка (стиль которой определяется в соответствующем css) а инициируется банально: $('a').easyTooltip();
    http://www.master-web.info/easytooltip-jquery-plugin/
     
    Sunday нравится это.
  3. Sunday

    Sunday

    Регистр.:
    13 дек 2009
    Сообщения:
    724
    Симпатии:
    314
    Спасибо, но это тоже самое, только иначе реализовано.

    Более чем уверен, что для знающих jQuery - это пустяк.
    Проще говоря, нужно, чтобы в функции не было привязки к конкретному ID, т.к. id блоков будут разные на странице.
     
  4. a_n_d_y

    a_n_d_y

    Регистр.:
    26 мар 2006
    Сообщения:
    465
    Симпатии:
    61
    ну так добавь к ссылке уникальные id например l1,l2,l3 и т.д., а у скрытых дивов соответственно tip_l1, tip_l2, tip_l3... В jquery дергаем айди ссылки на которую навели мышь и в функции показываем див с айди "#tip_"+linkid
    <-------------- добавлено через 30 сек. -------------->
    Вообще на одной странице не должно быть элементов с одинаковыми айди
     
    Sunday нравится это.
  5. dino

    dino

    Регистр.:
    28 май 2009
    Сообщения:
    550
    Симпатии:
    204
    Попробуйте так:
    Код:
    <script type="text/javascript">
            jQuery(function() {
    $("#new_tip .view-full-text").each(function(){
    var n=$(this).attr("alt");
        $(this).tooltip({
                bodyHandler: function(){
                    return jQuery("#"+n)[0].innerHTML;
                }, track: true,
                  delay: 0,
                  showURL: false,
                  fade: 250
                });
    });
    });
    </script>
    
    HTML:
    <div id="new_tip">
     
    <div id='tip_1' style="display:none">$fulltext1</div>
    <a href='#' class='view-full-text' alt="tip_1">Заголовок1</a>
     
    <div id='tip_2' style="display:none">$fulltext2</div>
    <a href='#' class='view-full-text' alt="tip_2">Заголовок2</a>
    </div>
    если не пашет прошу ногами не бить, на коленке писал и проверить не успел...
     
    Sunday нравится это.
  6. Sunday

    Sunday

    Регистр.:
    13 дек 2009
    Сообщения:
    724
    Симпатии:
    314
    dino, ваши коленки рулят :D
    Всё работает, спасибо :ay:
     
  7. dino

    dino

    Регистр.:
    28 май 2009
    Сообщения:
    550
    Симпатии:
    204
    o_O Жесть... сам с себя в шоке... :D
    Был рад помочь... обращайтесь ежели что.