Как разработать карусель без JavaScript

Question

Может кто-нибудь подсказать, как разработать сайт без jquery и javascript.

В настоящее время у меня есть карусель, разработанная с использованием плагинов цикла jquery, но, поскольку мы передумали, что мы должны реализовать наш сайт, веря, что «сеть для всех, используя прогрессивное улучшение», звучит хорошо для меня, но я понятия не имею, какЯ собираюсь изменить мою существующую карусель и аккордеон, чтобы она запускалась, если javascript отключен.

Я должен запустить эту карусель и аккордеон без javascript или минимального использования javascript.Использование только css3 и html5, поэтому, если javascript выключен, пользователи могут просматривать.В настоящее время без javascript, аккордеонных разрывов, просто он отображает все содержимое и карусель просто застряла!

Я просто ищу некоторые идеи, как запустить мою существующую карусель, аккордеон без JS.

Заранее спасибо.

Жду ваших ответов.

Answer 1

Интерактивность на сайтах осуществляется через CSS и Javascript. Если вы отключите Javascript, вам придется делать все интерактивные с CSS.

CSS3, безусловно, способен генерировать карусели. См. http://speckyboy.com/2010/06/09/10-pure-css3-image-galleries-and-sliders/ для некоторых примеров. Вот (немецкий, но понятный) обзор чистой карусели CSS3: http://webstandard.kulando.de/post/2010/05/21/sliding-image-gallery-css3-transition-tutorial

Тем не менее, хотя это приятно и решает проблему для людей, у которых нет Javascript, оно создает столько же проблем для людей с более старыми браузерами, которые не поддерживают CSS3 ...

Скажите своему боссу, что всегда найдутся люди, у которых нет Javascript, нет CSS3, не нравятся карусели или даже нет интернета. Вы не можете сделать свой сайт доступным для всех! Просто подумайте о затратах и ​​выгодах, и выберите разумный вариант!

Я сам думаю, что Javascript с резервным CSS3 хорошо работает для большинства:)

Удачи!

Answer 2

Вы захотите проверить переходы, преобразования css3 и псевдокласс: active.

переходы: http://www.alistapart.com/articles/understanding-css3-transitions/

преобразований: http://24ways.org/2010/intro-to-css-3d-transforms

псевдоклассы: http://coding.smashingmagazine.com/2011/03/30/how-to-use-css3-pseudo-classes/

В конечном итоге вы отобразите все изображения одновременно или одно статическое изображение в браузерах, например ie6, если не хотите использовать javascript.