Помогите выиграть конкурс.
Прелоадер страницы на jquery
Считаю использование прелоадера для не флешевых сайтов бесполезным, человек должен видеть то что загружается, если даже сайт большой, но я зашел посмотреть например контакты, смысл мне ждать пару минут пока загрузятся, все баннера, текст и картинки, но иногда заказчики хотят такую технологию.
Велосипед я не изобретал, это решение предложил Гайя Кесслер на своем блоге http://www.gayadesign.com/diy/queryloader-preload-your-website-in-style/
Пример можете посмотреть вот здесь ТЫЦ
Довольно любопытное кстати решение. Его вполне можно переделать под свои нужны, дизайн и тд.
Сами скрипты скачать можно здесь ТЫЦ
Подключение простенькое:
- <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js'></script>
- <link rel="stylesheet" href="css/queryLoader.css" type="text/css" />
- <script type='text/javascript' src='js/queryLoader.js'></script>
И в самом низу перед закрывающимся </body> вызов
- <script type='text/javascript'>
- QueryLoader.init();
- </script>
Для настройки анимации можно посмотреть код QueryLoader.animateLoader () и QueryLoader.doneLoad ()
Похожий материал:
- Устраняем конфликт между разными версиями jquery. А так же как сделать что бы YoxView работал с новой версией jquery
- lightBox эффект всплывающих фотографий для Ucoz
- Как отключить отправку формы по нажатию enter?
- jQuery lightBox plugin - lightBox эффект всплывающих фотографий
- Ширина options select IE
Комментарии
прелоадер
Тварищи,объяснить подробно,как сие чудо засандалить в джумлу )))
А я разве не объяснил как его
А я разве не объяснил как его прикручивать к сайту?
К джумле таким же макаром прикручивается. Всё что я написал в статье делается в индекс файле вашего шаблона, и будет вам счастье!
Под версии JQuery
В строке 64 queryLoader.js в случае если выдает ошибку $(this).attr("tagName") is undefined то меняем attr на prop
ВОт я не поняла: а куда
ВОт я не поняла: а куда девать первую часть кода?
И еще: если у меня движок joomla, файлики класть по пути:
/templates/шаблон/CSS
/templates/шаблон/js
?
>прошу помочь
Если вы имеете введу куда
Если вы имеете введу куда вставить:
То по стандарту такое вот пишут между
<head>....</head>Насчет файлов то лучше всего сохранять их в папку шаблона, но нужно еще прописать потом путь к этим файлам
Например путь к папке с ЦСС файлом
<link rel="stylesheet" href="<?php echo $tmpTools->templateurl(); ?>/css/queryLoader.css" type="text/css" />Прописывается всё в шаблоне в index.php, только именно в файле шаблона, а то положите свою джумлу.
Понятно, а к файлу js как
Понятно, а к файлу js как тогда? в 3 строчке:
<script type='text/javascript' src='js/queryLoader.js'></script>Так же как и к цсс. <link
Так же как и к цсс.
<link rel="stylesheet" href="<?php echo $tmpTools->templateurl(); ?>/js/queryLoader.js" type="text/css" />Вот это строчка "<?php echo $tmpTools->templateurl(); ?>" означает путь к папке шаблонов и к шаблону который сейчас используется.
Странно( после вставления
Странно( после вставления этого кода, грузится пустая страница
файлы лежат там, где надо; 1 часть кода в
<head>; конец скрипта перед</body>... что же может быть не так?делается всё в файле index.php в папке с шаблоном
Пустая страница не может
Пустая страница не может грузиться, значит вы что то поломали в шаблоне. Проверьте точно ли файлы лежат там куда вы прописали путь, проверить можно через исходный код.
Если прописываю полный путь к
Если прописываю полный путь к файлам, то просто грузится сайт, без прлоадера
Кстати еще может быть
Кстати еще может быть проблема конфликта джейвери библиотеки и мутул. По умолчании мутулс можно отрубить, или прописать для джейквери строчку что бы не конфликтовало не кто не с кем.
У меня в блоге где то была статейка по этому поводу
Знатный прелоадер! Я бы с
Знатный прелоадер! Я бы с удовольствием его ипользовал, но...
Мне не нравится чередование серого - черного тонов. А самому исправить - не получается.
Цвета меняются в файле стилей
Цвета меняются в файле стилей css
Цитирую: "...человек должен
Цитирую:
"...человек должен видеть то что загружается, если даже сайт большой но я зашел посмотреть например контакты, смысл мне ждать пару минут пока загрузятся, все баннера, текст и картинки..."
Если вы хотите посмотреть контакты, значит, вы наверняка уже заходили на этот сайт, и все ваши похождения сохранились, вы же не чистите куки при каждом заходе в интернет? Значит сайт загрузится моментально.
А вот это как раз не факт. У
А вот это как раз не факт. У меня наоборот меньший процент сайтов куда я захожу смотреть контакты, больше как то всё новые сайты. Те же интернет магазины.
Кстати вам не когда не попадались сайты "кишки", то есть сайт на одной странице но разбитый якорями, так вот они обычно ой как долго грузятся. При повторном входе конечно уже побыстрее :)
Да и если честно то не особо я люблю прелоадеры хоть и приходится использовать их.
Прелоадер замечательный и CSS
Прелоадер замечательный и CSS для настройки порадовал, но вот я поставил его на Joomla 1.6, назначил шаблон для одного пункта меню. Для этого пункта грузит все замечательно, а для отдельных материалов из категории этого пункта зависает на 93%. Странно... Буду пилить...
Такая штука бывает если не
Такая штука бывает если не загружается какая то картинка. то есть она прописана но например её нет на сервере. У меня по крайней мере такой баг был, но правда на 96%
Прелоадер еще не совершенен :(
Это просто СУПЕР!!!!!!!! как
Это просто СУПЕР!!!!!!!! как раз то что искал!!! Хотел делать на флеше, но мануалов внятных для своего уровня знаний не нашёл!!!!
давно именно такой
давно именно такой искал.
можно по подробнее как его установить.
Куда уже подробней, я же
Куда уже подробней, я же написал что нужно делать
Прелоадер страницы на jquery
Спасибо за Ваш пост о прелоадере, который изобрел Гайя Кесслер. Это именно то что я искал для своего сайта на Joomla. Дело в том, что из за обилия графики мой сайт долго грузится, и что бы, как то, занять посетителя, нужен был этот самый прелоадер. Несколько часов и куча англоязычных блогов и форумов позади(где обсуждались, в основном,прелоадеры для флэш сайтов), я и не надеялся встретить такой хороший продукт в русскоязычном представлении. Большое спасибо!
Ну собственно у меня стояла
Ну собственно у меня стояла такая же задача. Для флеш сайтов то я знал как делать, а вот для обычных сайтов не знал.
Этот прелоадер тоже далек от идеала но все же рабочий.
Пользуйтесь на здоровье.
Вопрос
Хороший прелоадер. Установил на Джумлу. Но вот вопрос: как сделать, что бы прелоадер включался только раз при загрузке сайта. Просто надоедает, когда каждый переход по сайту наблюдаешь прелоадер.
Для этого сам скрипт:
Для этого сам скрипт:
помести в модуль, типа "Special HTML", и назнач вывод модуля только на главную страницу. Да и еще модуль желательно использовать самый нижний в структуре шаблона ;)
Лично я сделал так и теперь прелоадер только на главную ))
Какая то не правильная идея.
Какая то не правильная идея. Это же прелоадер, а сайт у вас же не на аяксе, значит страницы сайта перезагружаются, и значит что то каждый раз грузиться, вот и прелоадер делает свое дело. Собственно если бы и на аяксе был бы то должны быть прелоадеры.
Спасибо
Благодарю автора. Очень полезный пост.