Свои подсказки
964
8.6 из 10
Проголосовало: 12
Проголосовало: 12
- Скачать с сервера
- Скачать
Всем привет, сегодня мы научимся делать свои всплывающие подсказки, скрипт очень простой и легко настраивается. но меньше слов больше дела перейдем к установке и настройке:
Установка:
1. Пропишем data в наших div и прочих элементах (Можно сменить на любой свой тег не кретично).
Код
<div data="<img src='http://cs11130.vk.me/u36206498/127629584/x_d90fe64a.jpg'> <br><center>
Cтудия графики и дизайна Best Studio, как студия перспективных веб-разработок, была основана 1 июля 2009 г. Уже более 17000 зарегистрированых пользователей!">Наведи на меня</div></center></div>
Cтудия графики и дизайна Best Studio, как студия перспективных веб-разработок, была основана 1 июля 2009 г. Уже более 17000 зарегистрированых пользователей!">Наведи на меня</div></center></div>
2. Добавим сам скрипт:
Код
<script>$(function(){
$('div, a, span').hover(function(){
var myhit = $(this).attr('data');
$(this).append('<div class="myHit">'+myhit+'</div>');
}, function() {
$('.myHit').remove();
});
}); </script>
$('div, a, span').hover(function(){
var myhit = $(this).attr('data');
$(this).append('<div class="myHit">'+myhit+'</div>');
}, function() {
$('.myHit').remove();
});
}); </script>
div, a, span - Элементы для которых преобразовывается и выводятся наша инфа.
3. Добавим CSS вид нашего окна:
Код
.myHit {
position: absolute;
background: #fff;
border: 1px solid #ccc;
border-radius: 3px;
padding: 5px;max-width:250px;
box-shadow: 0pc 0pc 10px #ccc;
}
.myHit img {max-width:100%;}
position: absolute;
background: #fff;
border: 1px solid #ccc;
border-radius: 3px;
padding: 5px;max-width:250px;
box-shadow: 0pc 0pc 10px #ccc;
}
.myHit img {max-width:100%;}
Автор публикации: Загрузка
Загрузка
- Всего комментариев: 3
0
|
На элементе пропишите атрибут для наводки и пропишите его js заменив div, a, span на ваш атрибут, после замены все будет работать для указанного вашего атрибута!...
|
0
|
Ааа мне просто было лень посмотреть:) Спасибо большое!!!
 Заменил на "nav" |
|
0
|
при на воде на надпись - undefined , появляется и на всё что с ним рядом такая же надпись при наводе. как нормально сделать?
|
- Оставить комментарий:
Меню сайта
Категории
Мини-чат
Последние комментарии
Это моя работа, которая велась давольно таки давно Времени было мало, поэтому я скачал полностью все, что было и сделал архив 
Времени было мало, поэтому я скачал полностью все, что было и сделал архив 
Последние темы
Опрос
Статистика
| 0 онлайн |
0 наших |
0 чужих |
0
Сегодня были
Топ пользователей:
 |  |  |  |  |  |
 |  |  |  |  |  |
- Обратная связь
- Правила
- RSS
- +18
- Мобильная версия
- Хостинг от uCoz
- Copyright - webo4ka.ru © 2010-2025 г.
- Design by Вовчик Администратор:)