3D слайдер изображений на CSS3 и Javascript
Старый добрый 3D слайдер, который выполнен на CSS3 + Javascript
Для начала посмотрите ДЕМО
Установка:
1#: На странице, где должен быть слайдер, перед закрывающим тегом </head> вставьте:
|
1 |
<link rel="stylesheet" type="text/css" href="/css/slide3d.css"> |
2#: Следующий код вставьте на этой же странице в то место, где должен быть слайдер:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<div class="slider3d"> <div class="slider3d_wrap"> <div style="background-image: url(ССЫЛКА_НА_КАРТИНКУ)">1</div> <div style="background-image: url(ССЫЛКА_НА_КАРТИНКУ)">2</div> <div style="background-image: url(ССЫЛКА_НА_КАРТИНКУ)">3</div> <div style="background-image: url(ССЫЛКА_НА_КАРТИНКУ)">4</div> <div style="background-image: url(ССЫЛКА_НА_КАРТИНКУ)">5</div> <div style="background-image: url(ССЫЛКА_НА_КАРТИНКУ)">6</div> </div> </div> <div class="slider3d_left">←</div> <div class="slider3d_right">→</div> <script type="text/javascript" src="/js/slide3d.js"></script> |
Осталось лишь залить JS файл из прикреплённого архива в папку js и CSS файл в папку css
