Здравейте значи ефекта е много е прост, но нещо не ми се получава. Имам едно бохче където има голяма снимка (текуща) и други по малки и като се мине върху тях се показва друга картинка като текущата се маха и се появява нова но всичко идва от това че задавам в фунцкията mouseover ето това
И от този ред код идва целия проблем ето давам ви html, css и jquery:
Html:
css:
jQuery:
Код:
var tekushta_kartinka = $(".vtora");
И от този ред код идва целия проблем ето давам ви html, css и jquery:
Html:
Код:
<div id="view_toppom">
<img class="parva" src="obiavi_avatars/'.$getid.'/'.$rmy['img_src1'].'" />
<img class="vtora" src="obiavi_avatars/'.$getid.'/'.$rmy['img_src2'].'" />
<img class="treta" src="obiavi_avatars/'.$getid.'/'.$rmy['img_src3'].'" />
<img class="chetvarta" src="obiavi_avatars/'.$getid.'/'.$rmy['img_src4'].'" />
</div>
<div id="imgslide">
<img class="slideparva" src="obiavi_avatars/'.$getid.'/'.$rmy['img_src1'].'" />
<img class="slidevtora" src="obiavi_avatars/'.$getid.'/'.$rmy['img_src2'].'" />
<img class="slidetreta" src="obiavi_avatars/'.$getid.'/'.$rmy['img_src3'].'" />
<img class="slidechetvarta" src="obiavi_avatars/'.$getid.'/'.$rmy['img_src4'].'" />
</div>
css:
Код:
.parva {width: 326px; height: 210px; margin-top: 4px;}
.vtora {width: 326px; height: 210px; margin-top: 4px;}
.treta {width: 326px; height: 210px; margin-top: 4px;}
.chetvarta {width: 326px; height: 210px; margin-top: 4px;}
.slideparva {width: 55px; height: 50px; margin-right: 5px;}
.slidevtora {width: 55px; height: 50px; margin-right: 5px;}
.slidetreta {width: 55px; height: 50px; margin-right: 5px;}
.slidechetvarta {width: 55px; height: 50px; margin-right: 5px;}
jQuery:
Код:
var parva = $(".parva");
var slideparva = $(".slideparva");
var vtora = $(".vtora");
var slidevtora = $(".slidevtora");
var treta = $(".treta");
var slidetreta = $(".slidetreta");
var chetvarta = $(".chetvarta");
var slidechetvarta = $(".slidechetvarta");
var tekushta_snimka = $(".parva");
vtora.hide();
treta.hide();
chetvarta.hide();
slideparva.mouseover(function(){
tekushta_snimka.hide();
parva.stop().show();
var tekushta_snimka = $(".parva");
});
slidevtora.mouseover(function(){
tekushta_snimka.hide();
vtora.stop().show();
var tekushta_snimka = $(".vtora");
});