Промяна на един елемент при посочване на друг

[misho]

Имам един списък (ul) и във всяко li имам някакъв текст и една картинка. Искам при посочване на дадено li да се появява въпросната картинка, която е в него. По подразбиране трябва да я няма. Въпросът е там, че тази картинка е връзка и не мога да я сложа като фон, който да променям с :hover. Някакви идеи как ще стане?

 

[smoke]

Защо не пробваш да зададеш тази снимка в <img като му зададеш position:absolute с z-index: -999999999999999; и с javascript го скриеш по подразбиране и ако има mouseover да го показваш и като има mouseout да се маха примерно?

 

[idevbg]

С jquery е най-добре. Инклудваш самото jquery в списъка слагаш номерация за id на всяко и клас (поне аз така бих го направил)

<img src='kartinka.jpg' id='kartinka1' class='kartinki'>

Като за всяка картинка id-то ти е със съответния номер. Списъка също.

<li id='item1' onmouseover='showImg(1)' onmouseout='hideOptions(1)'>

Така всеки елемент от списъка има id item и номер и картинката в него има id kartinka и същия номер и class kartinki. На мястото на всички единици, с две думи, трябва да отиде id-то на елемента от списъка.

В <head> слагаш [js]<script type='text/javascript'>
$(document).ready(function(){
$(".kartinki").hide();
});
function showImg(id) {
$("#kartinka"+id).show();
}
function hideImg(id) {
$("#kartinka"+id).hide();
}
</script>[/js] Това са основите .. ако има нещо питай.

 

[misho]

И аз мислех някакви варианти с JS, но съм малко бос там. Пробвах с jQuery, но без успех. Някакъв пример, ако може!

Промяна:
idevbg, благодаря! Ей сега ще пробвам. :wink:

 

[misho]

idevbg, много благодаря! :?:

[js]$(document).ready(function() {
$(".kartinki").hide();
});[/js]
Единствено тези редове отпаднаха. Сложих направо display:none; на всички картинки. :wink: