Показать сообщение отдельно
  #1 (permalink)  
Старый 05.04.2017, 10:12
Профессор
Отправить личное сообщение для Янковиц Посмотреть профиль Найти все сообщения от Янковиц
 
Регистрация: 17.11.2014
Сообщений: 403

Позиционирование всплывающей подсказки
Добрый день. Есть всплывающая подсказка вида:
<a href="#" class="ret screentip">ссылка
<span id="texts">Подсказка</span>
</a>

И стили
<style>
.screentip{
	position: relative; /* позиционируем */
	display: inline-block;
	background: #eaeaea;
	color: #232323;
	text-decoration: none;
	cursor: help;
	outline: none;
}
.screentip span{
	position: absolute; /* позиционируем */
	z-index: 999; /* выдвигаем на передний план */
	visibility: hidden; /* временно скрываем */
	left: 50%;
	bottom: 30px;
	top: 30px;
	margin-left: -127px;
}
.screentip:hover{
	border: 0; /* используем если необходим IE6 fix */
	position:relative;
	z-index: 9999;
}
.screentip:hover span{
	visibility: visible; /* отображаем подсказку */
}
</style>


Как при помощи js сделать, чтобы подсказка не выходила за поля браузера, то есть в зависимости от расположения на экране, подсказка меняет значение margin-left и top.
Спасибо
Ответить с цитированием