Модераторы: Sardar, Aliance
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> DIV всплывающий, как подсказка 
:(
    Опции темы
Анфиса
Дата 1.12.2009, 10:36 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 15
Регистрация: 27.11.2009

Репутация: нет
Всего: нет



Может кто-нибудь подкинет ссылку, как сделать DIV, всплывающий как подсказка?
PM MAIL   Вверх
skyboy
Дата 1.12.2009, 11:14 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


неОпытный
****


Профиль
Группа: Модератор
Сообщений: 9820
Регистрация: 18.5.2006
Где: Днепропетровск

Репутация: 3
Всего: 260



речь о появлении при наведении и исчезании при уводе курсора в сторону? смотри в сторону javascript, обработка событий mouseover и mouseout.
или речь о верстке этого "плавающего слоя"? тогда смотри в сторону CSS, позиционирования со значением absolute
PM MAIL   Вверх
KonstRuctor
Дата 1.12.2009, 14:19 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 245
Регистрация: 31.3.2006
Где: Россия, Санкт-Пет ербург

Репутация: нет
Всего: нет



Видимо, речь идет о тултип (tooltip).
Есть готовые решения, рекомендую для начала попробовать свои силы в подключении готовых.
Лично мне очень нравится такое решение:
где-то внизу документа создаются дивы, в которых содержится текст подсказок.
Сколько нужно подсказок, столько дивов.
Разумеется, эти дивы спрятаны.
При наведении мышки на требуемый объект рядом показывается слой с искомым текстом.
Очень удобно управлять подсказками:
1) Нет единого файла с подсказками, как в некоторых других скриптах
2) Все подсказки для каждого конкретного документа содержаться в нем самом.
* * *
В сложных случаях удобным может оказаться подгрузка html-подсказок с помощью ajax
PM MAIL WWW ICQ   Вверх
Sinneren
Дата 9.12.2009, 17:57 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


{YaGoo}
*


Профиль
Группа: Участник
Сообщений: 68
Регистрация: 20.3.2009
Где: Уфа

Репутация: нет
Всего: 1



Код

<body>
    <script language="javascript">
    function show(id)
    {
    document.getElementById('666').style.visibility='visible';
    }
    function hide(id)
    {
        document.getElementById('666').style.visibility='hidden';
    }
    </script>
<form>
<input type="button" value="Button" onmousemove="show(id)" onmouseout="hide(id)"/>
</form>
<div style="visibility: hidden" id="666">
<table style="margin:3px; background-color:#993";>
<tr>
<td>
Hello,World!
</td>
</tr>
</table>
</div>
</body>


вот такой вариант...
PM MAIL WWW ICQ Skype   Вверх
Sinneren
Дата 10.12.2009, 16:53 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


{YaGoo}
*


Профиль
Группа: Участник
Сообщений: 68
Регистрация: 20.3.2009
Где: Уфа

Репутация: нет
Всего: 1



а вот как сделать для нескольких чтоб постоянно не копипастить я не знаю, мож кто подскажет?   smile 
PM MAIL WWW ICQ Skype   Вверх
comcon1
Дата 12.12.2009, 01:48 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 838
Регистрация: 11.6.2005
Где: Москва ДАС-МГУ

Репутация: 0
Всего: 17



смотри код выше и делай дивов сколько хочешь. НО! ошибки детектед. Вот правильная:
Код

<body>
    <script language="javascript">
    function show(id)
    {
    document.getElementById(id).style.visibility='visible';
    }
    function hide(id)
    {
        document.getElementById(id).style.visibility='hidden';
    }
    </script>
<form>
<input type="button" value="Button" onmousemove="show('666')" onmouseout="hide('666')"/>
</form>
<div style="visibility: hidden" id="666">
<table style="margin:3px; background-color:#993";>
<tr>
<td>
Hello,World!
</td>
</tr>
</table>
</div>
</body>



--------------------
PM MAIL   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | JavaScript: для новичков | Следующая тема »


 




[ Время генерации скрипта: 0.0531 ]   [ Использовано запросов: 22 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.