Вход

Просмотр полной версии : смена фоток в галерее, как сделать эффект.


InviS
18.09.2010, 02:38
Ребят, подскажите, пожалуйста... Есть у меня 10 фотографий, к примеру, они хранятся в БД. Есть div для отображения фото, а внизу 2 стрелки - влево и вправо. Хотелось бы прикрепить эффект выезда фотки. т.е, например, при нажатии на стрелку вправо - текущая фотка начинает уезжать вправо, а слева выезжает новая. Как такое сделать?

Можно просто идею, без реализации. Спасибо!

Sweet
18.09.2010, 09:31
Главное получить ссылки на фотки. Например, AJAX'ом.
Поскольку фоток всего 10, можно сразу поставить в линию 10 тэгов img(div'у ставим overflow: hidden). Затем нужно решить все ли сразу они будут загружаться, или по мере необходимости. Первый вариант, естественно, гораздо проще: просто указываем при создании img свойства src, и картинки будут загружаться. Второй вариант тоже связан с src, только изменяем его при нажатии на стречки.
На картинки вешаем onload, чтобы новая картинка выезжала только когда загрузится. Ну и анимация (http://javascript.ru/blog/Andrej-Paranichev/Osnovy-programmnoj-animacii-JavaScript) тебе в помощь.

InviS
18.09.2010, 10:53
та проблема не в этом. со стороны js я вроде как догадываюсь как сделать. Как сверстать это? т.е. мне ж нужно чтоб эти картинки где-то хранились, чтоб не съезжали. или абсолютом?

Sweet
18.09.2010, 11:30
Как сверстать это?

<style>
DIV {
overflow: hidden;
height: ...px;
width: ...px;
}
IMG {
border: none;
display: inline;
float: left;
}
</style>
<div>
<img />
<img />
...
<img />
</div>
Но делать все это лучше средствами javascript