замена изображений в jquery при наведении
Доброго всем времени суток . Буду очень благодарен, если поможете решить проблемку . Вообщем нужно реализовать замену изображений при наведении мыши , своими силами получилось вот что:
Код:
<!--html-->
<html>
<ul id="photogallery">
<li id="first_photo">
<img src="images/first_photo.gif" />
<img src="images/first_photo2.gif" />
</li>
<li id="second_photo">
<img src="images/second_photo.gif" />
<img src="images/second_photo2.gif"/>
</li>
<li id="third_photo">
<img src="images/third_photo.gif" />
<img src="images/third_photo2.gif"/>
</li>
</ul>
</html>
<!--css-->
#photogallery{
margin-top:33px;
position:absolute;
display:inline;
top:0px;
left:43px;
}
#photogallery li{
margin-right:2px;
display:inline;
width:86px;
height:62px;
padding:0px;
}
<!--jquery-->
$(function(){
$('#photogallery li img[src$=2.gif]').hide();
$('#photogallery li img').hover(
function(){
$(this).hide();
$(this).next('img').show();
},
function(){
$(this).show();
$('#photogallery li img[src$=2.gif]').hide();
}
);
});
оно почти работает только картинки при замене и перемещении по ним мыши дрожат что ли) . Заранее спасибо! |