Отображение ссылок при нажатии на картинку [Архив форума]

Просмотр полной версии : Отображение ссылок при нажатии на картинку

deNSe_01

25.06.2011, 17:35

Всем привет! Возник вопрос - нужно сделать скрипт, задача которого при нажатии на картинку (внутри таблицы) выводить две ссылки сверху на этой картинке.
В идеале нужно выводить по событию onMouseOver и убирать по onMouseOut. Проблема в том, что когда курсор перемещается на ссылку, она убирается. Как решить этот вопрос? И если нереально, то как реализовать первый вариант? Помогите плиз!

walik

25.06.2011, 17:56

<html>
<head>
<script>
window.onload = function() {
showLinks = function() {
clearTimeout(window.t);
document.getElementById('links').style.display = 'inline';
}

hideLinks = function() {
window.t = setTimeout(function() {
document.getElementById('links').style.display = 'none';
}, 1000);
}

document.getElementById('image').onmouseover = showLinks;
document.getElementById('image').onmouseout = hideLinks;

document.getElementById('links').onmouseover = showLinks;
document.getElementById('links').onmouseout = hideLinks;
}
</script>
<style>
#links {
display: none;
}
</style>
</head>
<body>
<span id="links"><a href="#">Bla bla bla</a> | <a href="#">Bla2 bla 2 bla2</a></span><br /><br />
<img id="image" src="http://javascript.ru/forum/images/smilies/smile.gif" height="100" width="100" />
</body>
</html>

Aetae

25.06.2011, 18:04

deNSe_01

26.06.2011, 18:58

Спасибо, Aetae! То, что нужно! А как сделать тоже самое не для div, а для класса, и менять background-image при наведении на эту картинку (ну то есть менять саму картинку)?

trikadin

27.06.2011, 01:58

Выучить CSS.

Learn it (http://htmlbook.ru/samcss))

deNSe_01

27.06.2011, 10:39

trikadin, в css я и в самом деле полный нуб, поэтому и спрашиваю.
Перешёл по ссылке, порылся но ничего не нашёл. Вот мой код:

.hLink
{
background-image:url('images/frame.png');
}

.hLink a
{
display:none;
}

.hLink:hover a
{
display:inline;
background-image:url('images/frame_h.png')
}

Цель см. выше. Так какая здесь ошибка?