Картинка меняющаяся при наведении.

BARTBERSERK · Сообщение **BARTBERSERK** » 19 июл 2009, 19:03

Помогите пожалуйста уже обыскался в Интернете.

Вобщем Хочу Сделать Чтоб кнопочки менялись одна на другую при наведении на неё мышью и можно было переходить по ссылке.

Как на етом сайте : Blizzard.com

Помогите пожалуйста! Уже Устал искать. :'(

K@kTuS · Сообщение **K@kTuS** » 19 июл 2009, 19:09

Код:

Код: Выделить всё

<td height="96" background="/shared/blizz-com/images/layout/spotlight_bgm.gif" align="center">
<a href="http://www.worldofwarcraft.com/" onMouseOver="point('wrath')" onMouseOut="nopoint('wrath')">
<img src="/shared/blizz-com/images/layout/spotlight_logo_wowwrath_off.jpg" width="129" height="96" 
border="0" name="wrath"></a></td>

ответ в исходном коде страницы

Coutty · Сообщение **Coutty** » 19 июл 2009, 19:16

K@kTuS, сам по себе этот отрывок работать не будет - тут же функция вызывается.

Но в целом - это так:

HTML код:

Код: Выделить всё

<img src="image1.jpg" onmouseover="this.src='image2.jpg';" onmouseout="this.src='image1.jpg';" />

K@kTuS · Сообщение **K@kTuS** » 19 июл 2009, 19:20

Цитата Coutty:

сам по себе этот отрывок работать не будет

Картинка меняющаяся при наведении.

я знаю, я лишь дал наводку на решение проблемы

Если присмотреться, onmouseout и onmouseover в моем посте выделены жирным шрифтом ))

BARTBERSERK · Сообщение **BARTBERSERK** » 19 июл 2009, 19:20

Спасибо

Вот ещё вопрос Надо Вставить 7 фото примерно так

( ) ( ) ( ) ( ) ( ) ( ) ( )

У каждого Фото есть 2 версии обычное и которе появляется при наведении .

Ещё Желательно чтобы при загрузке страницы фото стояли сразу на своих местах без наводки.подскажите плиз!

BARTBERSERK · Сообщение **BARTBERSERK** » 19 июл 2009, 19:29

Люди Помогите Пожалуста !!! Подскажите Что Надо Писать!!! :'(

proxy · Сообщение **proxy** » 19 июл 2009, 20:59

BARTBERSERK,

как расположить фото

можно почитать тут

(галерея изображений)

Цитата BARTBERSERK:

У каждого Фото есть 2 версии обычное и которе появляется при наведении

Картинка меняющаяся при наведении.

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

Опять же, есть готовые решения

LiteBox например

,

пример

Цитата BARTBERSERK:

Вобщем Хочу Сделать Чтоб кнопочки менялись одна на другую при наведении на неё мышью и можно было переходить по ссылке.

Картинка меняющаяся при наведении.

K@kTuS, Coutty,

а с css normal / hover / active - не проще?

BARTBERSERK · Сообщение **BARTBERSERK** » 19 июл 2009, 20:59

вот код Вставлял его на пустую страницу работает нормально только все изображения при загрузке страницы держат на себе изображение 1.jpg и только когда наводишь на них они переходят в свои пары 2-2(2) 3-3(2) 5-5(2) и т.д.

пытался вставить в сайт но из-за етого всё перемешалось и фотки стали появлятся везде.

Скажите плиз что в етом коде неправильно?

HTML код:

Код: Выделить всё

<style>		
a {
	position:absolute;.
	left:10;
	width:157;
	height:152;
	text-align:center;
	background-image:url('1.jpg');
	}
div:hover.na {
	background-image:url('1(2).jpg');
	} 
</style>
<body>
<a  class='a' style='left:0' onmouseover='this.style.backgroundImage="url(\"1(2).jpg\")"' onmouseout='this.style.backgroundImage="url(\"1.jpg\")"'href='http://'></a><a  class='a' style='left:180' onmouseover='this.style.backgroundImage="url(\"2(2).jpg\")"' onmouseout='this.style.backgroundImage="url(\"2.jpg\")"'href='http://'></a><a  class='a' style='left:360' onmouseover='this.style.backgroundImage="url(\"3(2).jpg\")"' onmouseout='this.style.backgroundImage="url(\"3.jpg\")"'href='http://'></a><a  class='a' style='left:540' onmouseover='this.style.backgroundImage="url(\"4(2).jpg\")"' onmouseout='this.style.backgroundImage="url(\"4.jpg\")"'href='http://'></a><a  class='a' style='left:720' onmouseover='this.style.backgroundImage="url(\"5(2).jpg\")"' onmouseout='this.style.backgroundImage="url(\"5.jpg\")"'href='http://'></a><a  class='a' style='left:900' onmouseover='this.style.backgroundImage="url(\"6(2).jpg\")"' onmouseout='this.style.backgroundImage="url(\"6.jpg\")"'href='http://'></a><a  class='a' style='left:1080' onmouseover='this.style.backgroundImage="url(\"7(2).jpg\")"' onmouseout='this.style.backgroundImage="url(\"7.jpg\")"'href=''></a>

proxy · Сообщение **proxy** » 19 июл 2009, 23:52

Цитата BARTBERSERK:

Картинка меняющаяся при наведении.

это кнопочки или галерея изображений?

если кнопочки - то имхо лучше использовать css.

пример, если кнопки:

читать дальше »

Код: Выделить всё

<html> 
<head> 
<title>Sent!</title> 
<style> 
.a1, .a2, .a3{
	margin-right:5px;
	width:157;
	height:152;
}
.a1, .a1:visited{ background-image:url('1.jpg'); }
.a2, .a2:visited{ background-image:url('2.jpg'); }
.a3, .a3:visited{ background-image:url('3.jpg'); }
.a1:hover{ background-image:url('1(2).jpg'); } 
.a2:hover{ background-image:url('2(2).jpg'); } 
.a3:hover{ background-image:url('3(2).jpg'); } 
</style>
</head> 
<body> 
<a class="a1" href="http://" title="Подсказка ссылки 1"></a>
<a class="a2" href="http://" title="Подсказка ссылки 2"></a>
<a class="a3" href="http://" title="Подсказка ссылки 3"></a>
</body> 
</html>

если галерея изображений, лучше приведи точное описание необходимой задачи: что? где? куда? как? когда?

так легче будет привести пример. опять же, попробуй использовать

готовые решения

, вот куча примеров - легко и удобно...

BARTBERSERK · Сообщение **BARTBERSERK** » 19 июл 2009, 23:52

Я Везде смотрел немогу найти

Мне надо вставить под шапку сайта 7 фото вряд размером в 157x152 каждая, и чтобы при наведении на неё она светится начиналась и можно было пройти по ссылке если тыкнешь по ней.

Может это флешем сделать или как?!

Картинка меняющаяся при наведении.

Картинка меняющаяся при наведении.

Re: Картинка меняющаяся при наведении.

Re: Картинка меняющаяся при наведении.

Re: Картинка меняющаяся при наведении.

Re: Картинка меняющаяся при наведении.

Re: Картинка меняющаяся при наведении.

Re: Картинка меняющаяся при наведении.

Re: Картинка меняющаяся при наведении.

Re: Картинка меняющаяся при наведении.

Re: Картинка меняющаяся при наведении.