Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Событие при наведении на изображение (https://javascript.ru/forum/dom-window/11448-sobytie-pri-navedenii-na-izobrazhenie.html)

krol 24.08.2010 14:04

Событие при наведении на изображение
 
Есть код что то типа галереи:
<a href="#"><img src="images/1b.jpg" alt="" id="bigest"  /></a>

<br /><br /><br />
<style>
.imgdark {
filter:alpha(opacity=50); ..-opacity:0.5; opacity:0.5; -khtml-opacity:0.5; 
}

.imgnone {
filter:alpha(opacity=100); ..-opacity:1; opacity:1; -khtml-opacity:1;
}
</style>

<a href="images/1b.jpg" title="1b" class="thickbox" rel="gallery-plants" target="_blank"><img src="images/1b.jpg" alt="" width="50" hspace="3" border="0" onMouseMove="bigimg(this)" class="imgdark" /></a>

<a href="images/2b.jpg" title="2b" class="thickbox" rel="gallery-plants" target="_blank"><img src="images/2b.jpg" alt="" width="50" hspace="3" border="0" onMouseMove="bigimg(this)" class="imgdark" /></a>

<a href="images/3b.jpg" title="3b" class="thickbox" rel="gallery-plants" target="_blank"><img src="images/3b.jpg" alt="" width="50" hspace="3" border="0" onMouseMove="bigimg(this)" class="imgdark" /></a>

<script type="text/javascript">
<!--
function bigimg(elem){document.images["bigest"].src = elem.getAttribute("src");

var img = elem.className;
if (img == 'imgnone') {img = 'imgdark'; elem.className=img;}
if(img == 'imgdark') {img = 'imgnone'; elem.className=img;}
}

//-->
</script>


Хочу сделать так что бы при наведении на изображении оно осветлялась (и оставалась таким же если отвести курсор от него) а другие изображения затемнялись
Сейчас сделал так что при наведении они осветляются но нужно чтобы остальные затемнялись как это сделать можно?

krol 28.08.2010 16:34

сделал так:
function bigimg(elem)
{
document.images["bigest"].src = elem.getAttribute("src");
for (i=1; i<document.images.length;i++){document.images[i].className='imgdark';}
var img = elem.className;
if(img == 'imgdark') {img = 'imgnone'; elem.className=img;}
}

работает но проблема в том что скрипт считает все картинки на странице и присваивает им class="imgnone" изначально.
Как работать именно с теми изображениями которые мне нужны?

ksa 30.08.2010 11:06

Цитата:

Сообщение от krol
Как работать именно с теми изображениями которые мне нужны?

Как вариант поместить их, ну скажем, в некий ДИВ... после чего "брать" их

var o=document.getElementById('myDIV').getElementsByTagName('img')


Далее по твоему алгоритму...


Часовой пояс GMT +3, время: 22:31.