1. Слайдер должен быть по вертикали 600px (высота)
2. В слайдере по центру аккуратно сложенно 2е стопки листов сертификатов (сертификат высотой 600px) слева от сертификатов стопка перевернутых листов. Между стопками есть пространство 20-100px.
Дизайн –
Дизайн в момент перелистывания –
Пример перелистывания. только надо не от нажатия а от движения мыши (что описано в п.5)
3. Перелистывание происходит как реалистичное перелистывание листа (сертификата) с одного угла сертификата и лист кладется в стопку перевернутых листов. Перелистывание должно быть красивым и реалистичным с тенями если надо.
4. По ширине слайдер на всю ширину, но стопки листов помещается в размер 1024px. и должны хорошо выглядеть на разрешении шириной 1024px, 1366px и шириной 1920px. Адаптацию под мобильные и планшеты делать не надо, на них мы слайдер отключим.
5. Когда мышка попадает на слайдер, то от движения мышки по горизонтали сертификаты начинают перелистываться. двигаешь вправо сертификаты возвращаются назад в стопку, двигаешь влево, сертификаты переворачиваются в стопку перевернутых. От малейшего движения мышки сертификаты плавно в зависимости от скрости движения мышки начинают перелистываться в ту или иную сторону и если человек остановит движение мышки, то сертификат останавливает процесс перелистывания в том положении в котором он остановился (и сертификат зависает в полу перевёрнутом положении). Полное пролистывание всех сертификатов происходит, когда человек проводит мышью с одного края своего экрана в другой край своего экрана (т.е. пока он ведёт мышкой от правого края экрана в левый край экрана у него по очереди перелистываются все сертификаты и последний перекладывается у левого края экрана). Когда перелистнулся последний сертификат у нас по центру ничего не остается. А когда мыш у правого края экрана у нас слева нет стопки перевернутых сертификатов.
6. Слайдер мы будем использовать на одной стране в нескольких местах с разными фотографиями. + еще на других страницах тоже слайдер будет использоваться с другими фотографиями (то есть должна быть возможность легко копировать слайдер в разные части сайта с разными фотографиями, и размещать несколько слайдеров с разными фотографиями на одной странице)
7. Должна быть возможность разместить разное количество фотографий в слайдере (чтобы он легко адаптировался под разное количество фотографий и распределял перелистывание по ширине экрана)
8. Внизу слайдера у нас полоса на всю ширину экрана (если невозможно, то шириной 1024px по центру) и высотой 5px и разбита на количество сертификатов в слайдере и красным заливается тот сектор, сертификат которого у нас активен.
9. Сайт трубы5.рф, CMS у нас mod-x revo, Шаблон сайта на bootstrap.