Joomla 1.0 tooltips средствами html

Discussion in 'CSS, HTML, Web 2.0, верстка по web-стандартам' started by doctorgrif, Dec 4, 2008.

  1. doctorgrif
    Offline

    doctorgrif Местный => Cпециалист <=

    Joined:
    Jan 14, 2008
    Messages:
    1,284
    Likes Received:
    66
    Gender:
    Male
    Речь пойдет о joostina
    Дал клиент задачу - реализовать всплывающие подсказки в одной статье. Опробовал кучу расширений - не то: не обрабатывается, обрабатывается не так как надо...и т.д.
    Решил вопрос средствами html. Реализацию выкладываю, может кому понадобится.
    Сразу пояснение - работа проводилась над 1 конкретной статьей, поэтому глобально css не насиловал, выводил стили через html редактор прямо в конкретной статье
    Собственно реализация:
    1. css стлиь для статьи, точнее тултипов
    Код (CODE):
    1. <style type=text/css>
    2. b{display:none;}
    3. a:hover b{display:block;width:440px;position:absolute;left:410px;border:3px groove;margin-top:-65px;background-color:#FFFFFF;padding:10px;}
    4. </style>

    отдельно фикс для IE 6.0
    Код (CODE):
    1. <!--[if lt IE 6]>a:hover {
    2. background: none;
    3. }<![endif]-->

    теперь вызов подсказки
    Код (CODE):
    1. <a href="#">Слово/фраза при наведении на которую будет выводится тултип<b>текст подсказки, возможно использование как тэгов html, так и mosimage</b></a>

    как реализовано смотрите тут - http://www.vamgazel.ru/content/view/45/35/
     
    doctorgrif, Dec 4, 2008
    #1

  2. Ads Master

     
  3. Wild Tiger
    Offline

    Wild Tiger Недавно здесь

    Joined:
    Jul 14, 2008
    Messages:
    190
    Likes Received:
    11
    Gender:
    Male
    в самом низу висит {jtips}testo|nomelink{/jtips}
     
    Wild Tiger, Dec 5, 2008
    #2
  4. doctorgrif
    Offline

    doctorgrif Местный => Cпециалист <=

    Joined:
    Jan 14, 2008
    Messages:
    1,284
    Likes Received:
    66
    Gender:
    Male
    Про это в курсе - пфтался ботом аякстипс навернуть - нифига, удалю...вчера уже забыл
    да и вам для отчета - ну не работают джумла-ориентированные тулитипы на жустине
     
    doctorgrif, Dec 5, 2008
    #3
  5. Wild Tiger
    Offline

    Wild Tiger Недавно здесь

    Joined:
    Jul 14, 2008
    Messages:
    190
    Likes Received:
    11
    Gender:
    Male
    увы, это так. YooTooltip работает наполовину, другие, правда еще не пробовал.
    А как в твоем решении сделать dotted-подчеркивание слова, по которому будет выводиться подсказка?
     
    Wild Tiger, Dec 5, 2008
    #4
  6. doctorgrif
    Offline

    doctorgrif Местный => Cпециалист <=

    Joined:
    Jan 14, 2008
    Messages:
    1,284
    Likes Received:
    66
    Gender:
    Male
    видимо, добавив нужную строку в css, я так думаю
    реализация такая "кастрированная" потому, что на сей момент большего не требовалось
    в принципе при отdivливании требуемого слова, тултипу да и слову можно задать требуемый стиль, включая и закругленные углы, эффекты мерцания, бегущий текст, etc
    но не нужно было это:)
     
    doctorgrif, Dec 5, 2008
    #5
  7. Offline

    blizzart Недавно здесь

    Joined:
    Feb 17, 2009
    Messages:
    18
    Likes Received:
    0
    Gender:
    Male
    Здравствуйте, меня мучает задача:
    сделать чтобы при наведение на пункты главного меню - появлялись подсказки
    Есть plugin tooltips.
    Форма похожа на приведенную выше ;)

    Только не знаю где это и как правильно написать. :(
    Решил в index.php сайта в конец закинуть такую строчку
    Код (html):
    1. <html>
    2. <body>
    3. <UL CLASS=mmenu>
    4. <LI><A CLASS=mpage HREF='index.php'>{tooltip}Главная{end-title}Просто о сайте{end-texte}Главная{end-tooltip} </A></LI>
    5. </UL>
    6. </body>
    7. <html>


    Подскажите , пожалуйста, как сделать это правильно.

    Может, подкините хотя бы какие-нибудь идеи по этом поводу?
     
    Last edited by a moderator: Jan 19, 2013
    blizzart, Nov 8, 2009
    #6
< Настройка <pre> и <code> для избегания скроллинга | Настройка <pre> и <code> для избегания скроллинга >

Share This Page

Loading...