Не могу разобраться с событием onmouseover

smesharic · May 9, 2013

Добрый день уважаемые знатоки.

Я новичок в html.

Нужна ваша помощь.

Есть два кода

При наведении курсора один увеличивает картинки, а другой текст.

Этот увеличивает картинки.


<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Событие onmouseover</title>
</head>
<body>
<p><img src="1.jpg" alt=""
onmouseout="this.src='1.jpg'" onmouseover="this.src='2.jpg'"> 
<img src="2.jpg" alt=""
onmouseout="this.src='2.jpg'" onmouseover="this.src='3.jpg'"></p>
</body>
</html>

Этот текст


<HTML>
<HEAD>
<TITLE>Увеличивающиеся линки</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=windows-1251">
<STYLE>
.bigChange {font-family:arial; color:blue; font-weight:bolder; font-size:175%; letter-spacing:4px; text-transform: uppercase; background:yellow}
.start {font-family:arial; color:yellow; background:navy}
</STYLE>
<SCRIPT LANGUAGE=Javascript>
function highlightButton(s) {
if ("INPUT"==event.srcElement.tagName)
event.srcElement.className=s
}
</SCRIPT>
</HEAD>
<BODY BGCOLOR="#000000" TEXT="#FFFFFF" LINK="#0000FF" VLINK="#7F007F" ALINK="#FF0000">
<H2><center>
<CENTER>
<span onmouseover = "this.style.fontSize = 'larger'"
onmouseout = "this.style.fontSize =''" style="color:red">Podvedite kursor mishi</span>
</P>
<P> <SPAN onmouseover = "this.className = 'bigChange'"
onmouseout = "this.className='start'" class=start>Можно использовать в меню</SPAN>
</p>
</BODY>
</HTML>

Так вот.

Я хочу что бы при наведении на текст слева или справа от текста всплывала небольшая картинка.

Скажите возможно ли это?

Заранее Большое Человеческое Спасибо!

red4pony · May 9, 2013

Так будет удобнее. Сможете стилизовать как Вам необходимо.

HTML


<div>
<p>Какой-то текст <img src="#" alt="картинка"></p>
</div>

CSS


img{
display: none;
height:100px;
width:100px;
position: absolute;
bottom:0;/*спозиционируете где Вам требуется*/
}
p:hover img{
display: block;
}

smesharic · May 10, 2013

Спасибо за ответ, просто мне немного другое нужно.

Есть сайт http://kubik-st.ru/index.php/product.

Тут хочу сделать что бы человек наводил на товар и отображалось изображение этого товара.

red4pony · May 10, 2013

Сам то я в JS не понимаю. А так как вызвался помогать, то вот через поиск нашел:

http://videouroki.su...-na-ssylku.html

smesharic · May 10, 2013

Огромное спасибо за статью! Буду пробовать теперь внедрить это в virtuemart:)

Спасибо

red4pony · May 10, 2013

Пожалуйста. Удачи

smesharic · May 10, 2013

Благодарю

Sign In

Не могу разобраться с событием onmouseover

Question

smesharic

Link to comment

Share on other sites

6 answers to this question

Recommended Posts

red4pony

Link to comment

Share on other sites

smesharic

Link to comment

Share on other sites

red4pony

Link to comment

Share on other sites

smesharic

Link to comment

Share on other sites

red4pony

Link to comment

Share on other sites

smesharic

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information