Делаю небольшую галарею на jQuery. Данный код снизу отлично работает. При клике на ссылку в диве listPhoto
фотография, указанная в её атрибуте href
подставляется в путь изображения в диве bigPhoto
. Плюс некоторая анимация на jQuery. Это понятно. В диве bigPhoto
с картинкой есть ссылки-стрелки "предыдущее фото" и "следуюшее фото". Дак вот как реализовать предназначенное для них действия (понятно, что на jQuery). При кликах на эти ссылки показываются предыдущее или следующее фото соответственно, из выбранных из базы фотографий (они выводятся в див listPhoto
)
<div class="myGalereya">
<div class="listPhoto">
<?php
$result_photo = mysql_query ("SELECT id, mini_photos, big_photos FROM photo WHERE id_photo = ".$id_photo." ORDER BY id_photo DESC");
$row_photo = mysql_fetch_array ($result_photo);
do {
echo "<a href='photo/".$row_photo['big_photos']."'><img src='photo/".$row_photo['mini_photos']."' alt=''/</a>";
} while ($row_photo = mysql_fetch_array ($result_photo));
?>
</div>
<div class="bigPhoto">
<a href="#" id="leftPh"></a> // Стрелка предыдущее фото
<img src='images/big_photo.jpg' alt='' />
<a href="#" id="rightPh"></a> // Стрелка следуюшее фото
</div>
</div>
код jQuery:
$(".listPhoto a").click(function(e) {
e.preventDefault();
$('.bigPhoto img').hide().attr('src',$(this).attr('href')).load(function(){
$(this).fadeIn(600);
});
// Здесь пишем обработку клика по ссылкам-стрелкам...
});