Пример:
HTML:
|
1 |
<div id="content-canvas"></div> |
CSS:
|
1 2 3 4 5 6 7 |
#content-canvas { width: 100%; height: 600px; margin: 20px auto; max-width: 724px; box-shadow: 0 8px 26px rgba(0,0,0,0.4), 0 28px 30px rgba(0,0,0,0.3); } |
JS:
- Подключаем three.min.js, TweenMax.min.js и скрипт слайдера slider.js
-
Изображения вставляются в переменной
const textures -
На примере использованы квадратные фотографии. Если используются другие размеры, в переменной
const geometry = new THREE.PlaneGeometry(1, 1);стоит указать соотношение сторон. Первое значение - ширина, второе - высота.
Добавить комментарий: