• Никакой политики на форуме. Иначе - бан!
  • Вопрос без рабочей ссылки на проблему считается риторическим. Без ссылки и скриншота - провокацией!
  • Темы озаглавленные с маленькой буквы или капсом удаляются без предупреждения!

Подскажите, как создать примитивное всплывающее меню на странице

warm12

Новичок
Всем привет. Возникла проблема с сайтом, не хватает навыков (

Подскажите, как создать примитивное всплывающее меню на странице?


Есть меню со значками. Суть в следующем, необходима менюшка, которая будет выползать при наведении на этот круглый значок. Или можно при клике, чтобы появлялась. И там был текст с описанием кратким и ссылкой на обратную форму....


Может есть какой то плагин или скрипт, чтобы привязать. Подскажите куда копать. Спасибо большое.


Прилагаю скрин так, как ссылку на сайт не могу скинуть он на оффе находится.
 

Вложения

  • Screenshot_109.png
    Screenshot_109.png
    93 KB · Просмотры: 5

warm12

Новичок
На какой странице? Категорий? Товаров?
Это все на главной странице. Одностраничный сайт для предоставления услуг. Чем меньше переходов по ссылкам тем лучше. Соответственно нужно чтобы клиент смотрит на этот кружок нажмет на него и выведется менюшка такая с текстом
 

tuxfighter

Гуру
Местный
еще можно набрать "модальное окно" или "всплывающая форма"
 

warm12

Новичок
Нашел вроде бы приемлемый вариант, вот

1. HTML разметка


<div class="poster">
<div class="descr">
Какой-то текст который должен быть в блоке<br>
<a href="#">Интересная ссылка</a>
</div>
</div>

2. Стили CSS


.poster{
position:relative;
margin:100px auto;
background:#ff6600;
height:200px;
width:150px;
}
.descr{
display:none;
margin-left:-350px;
padding:10px;
margin-top:17px;
background:#f3f3f3;
height:200px;
-moz-box-shadow:0 5px 5px rgba(0,0,0,0.3);
-webkit-box-shadow:0 5px 5px rgba(0,0,0,0.3);
box-shadow:0 5px 5px rgba(0,0,0,0.3);
}
.poster:hover .descr{
display:block;
position:absolute;
top:120px;
z-index:9999;
width:400px;


Пример №2 по ссылке http://gnatkovsky.com.ua/files/holder/index.html


Ребят, вопрос, стили я вставил, все работает, но куда вставить 1 код чтобы он действовал на мои вкладки?
 
Сверху Снизу