Плавные переходы страниц в HTML5 с помощью CSS3 без использования jquery

#html #css #mobile-website #transitions

#HTML #css #мобильный веб-сайт #переходы

Вопрос:

Я разрабатываю веб-страницу для мобильных устройств. Я знаю, что jquery потрясающий, но я не хочу его использовать. Я хочу добиться плавных переходов страниц, подобных этомуhttp://jquerymobile.com/demos/1.0a4.1 / но без использования jquery. Как я могу этого добиться? Между переходами страниц вызывается веб-служба, следовательно, будет задержка. Я хочу, чтобы это было как можно более плавным.

Ответ №1:

Признайте это: вам придется использовать JavaScript, и это будет очень утомительно без использования того или иного фреймворка. Чтобы получить плавные переходы страниц, у вас есть два варианта:

1) Запустите сайт как единую страницу. Это то, что используется на сайте, на который вы ссылаетесь. Во всем этом нет переходов страниц; это одна страница с некоторыми событиями нажатия, используемыми для анимации содержимого и динамической загрузки его с помощью AJAH.

2) Запустите многостраничный сайт, но с использованием локального хранилища. У вас будет небольшое количество страниц, и вы будете кэшировать необходимые для них ресурсы. JavaScript запускался бы мгновенно при загрузке страницы и рисовал бы красивый экран загрузки, в то время как обычный контент загружался и отображался AJAX.

Лично я бы не слишком беспокоился о переходах страниц; просто так работают веб-сайты. Также не пугайтесь jQuery, потому что к тому времени, когда вы напишете весь этот JavaScript, он вам понадобится. Даже для мобильных сайтов размер библиотеки практически приемлемо мал (вы можете использовать копию, кэшированную в CDN).