Всплывающие подсказки с текстом из большого текста

Тема в разделе "JavaScript", создана пользователем danneo, 8 окт 2015.

Модераторы: ZiX
  1. danneo

    danneo Честный

    Регистр.:
    13 ноя 2007
    Сообщения:
    1.453
    Симпатии:
    113
    Нужно сделать страницу с законом (подобие). На ней будет много текста.
    Далее, необходимо в тексте проставить ссылки на определенные пункты закона. При наведении на ссылку нужно, чтобы всплывала подсказка с этим пунктом.
    Как это можно сделать, если учесть, что все подсказки (пункты) размещены в одном большом документе, а не по отдельности, как отдельные записи в БД.
     
  2. Q_BASIC

    Q_BASIC

    Регистр.:
    30 ноя 2013
    Сообщения:
    385
    Симпатии:
    254
    Распарсить документ и в БД его, или json и в файл

    А потом что угодно делать
     
  3. danneo

    danneo Честный

    Регистр.:
    13 ноя 2007
    Сообщения:
    1.453
    Симпатии:
    113
    В какой вид распарсить?
     
  4. Q_BASIC

    Q_BASIC

    Регистр.:
    30 ноя 2013
    Сообщения:
    385
    Симпатии:
    254
    Распарсить, чтобы пункты были отдельно и все

    И никакой вид не надо
     
  5. denverkurt

    denverkurt Denve®

    Регистр.:
    23 дек 2013
    Сообщения:
    685
    Симпатии:
    376
    поместить пункты в <div> с какими нибудь классами. например
    Код:
    <div class="punkt1">...текст пункта закона...</div>
    либо абзацы точно также
    а на ссылку вешать обработчик, чтобы он забирал текст из указанного класса и показывал подсказку. все это довольно просто сделать на jQuery
     
    danneo нравится это.
  6. andystill

    andystill Постоялец

    Регистр.:
    23 апр 2012
    Сообщения:
    57
    Симпатии:
    6
    Так как пункты закона уникальны, их логичнее обернуть в свой id, а так как таковые будут обрабатываться одним скриптом, задать всем им общий (а не частный) класс.
    Условно <div id="p1" class="punkt">Содержимое пункта 1 закона </div>
    Далее в месте, где нужно ссылание на пункт 1, делаем ссылку с хешем на созданный див: <a href="#p1">Пункт 1</a>
    А через jQuery в скрипте прописываешь:
    $('.punkt').each(function(){
    var soderjimoe = $(this).html();
    var thisId = $(this).attr('id');
    $('[href="'+thisId+'"]).attr('title',soderjimoe);
    })

    Ну а уже атрибут title конкретного пункта ссылания можно легко обработать любым публичным плагином для всплывающих подсказок.
     
    Goldberg нравится это.
  7. denverkurt

    denverkurt Denve®

    Регистр.:
    23 дек 2013
    Сообщения:
    685
    Симпатии:
    376
    и самое главное не забыть про решетку в линке
     
  8. andystill

    andystill Постоялец

    Регистр.:
    23 апр 2012
    Сообщения:
    57
    Симпатии:
    6
    Можно и не ставить решетку в линке, но тогда в коде скрипта строку $('[href="'+thisId+'"]).attr('title',soderjimoe); заменить на
    $('[href="#'+thisId+'"]).attr('title',soderjimoe);

    и тогда ещё придётся добавлять событие клика по такому элементу...
    есть и другие методики организации связки, но этого автору думаю будет достаточно)