EOMY.NET
Хостинг EOMY.NET: Форум поддержки
 
 FAQFAQ   ПоискПоиск   ПользователиПользователи   ГруппыГруппы   РегистрацияРегистрация 
 ПрофильПрофиль   Войти и проверить личные сообщенияВойти и проверить личные сообщения   ВходВход 
RSS Feed  

Можно ли ускорить подгрузку скрипта и файлов?

 
Начать новую тему   Ответить на тему    Список форумов EOMY.NET -> JavaScript, AJAX
Можно ли ускорить подгрузку скрипта и файлов?
Автор Сообщение
SergejFedosov
11 1110 1000
11 1110 1000


Зарегистрирован: 18.08.2006
Сообщения: 1173

4057 Монеты

СообщениеДобавлено: Чт, 15 Мар, 2012 10:35    Заголовок сообщения: Можно ли ускорить подгрузку скрипта и файлов? Ответить с цитатой

Ситуация: статичный html-сайт. С помощью скрипта небольшие картинки на страницах при клике на них "разворачиваются" в полноразмерное изображение. Выполнено это с помощью скриптов http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js , zoom.js у меня на сервере и нескольких "связок" из двух jpg-файлов, маленького и большого. Вот таким образом:

Код:

<head>
...
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="zoom/zoom.js"></script>
...
</head>
...
<a href="images/about1.jpg" class="zoom"><img border="1" src="images/about11.jpg" width="250" height="188"></a>
<a href="images/about2.jpg" class="zoom"><img border="1" src="images/about22.jpg" width="250" height="188"></a>
<a href="images/about3.jpg" class="zoom"><img border="1" src="images/about33.jpg" width="250" height="188"></a>
...


Скрипт jquery.min.js размером 80 KB и большие файлы начинают загружаться при клике. Из-за этого происходит некоторая задержка, изображение начинает разворачиваться не сразу. Можно ли сделать так, чтобы скрипт и файлы загружались при загрузке страницы, не дожидаясь клика пользователя?
_________________
Полный церковно-славянский словарь
Вернуться к началу
Посмотреть профиль Отправить личное сообщение Посетить сайт автора
LaeX
Интернет на завтрак
Интернет на завтрак


Зарегистрирован: 12.10.2006
Сообщения: 25

2694 Монеты

СообщениеДобавлено: Чт, 15 Мар, 2012 19:44    Заголовок сообщения: Ответить с цитатой

Можно использовать небольшой скрипт на jQuery. Смысл такой: при загрузке страницы находим все ссылки с классом zoom, берем из них ссылки и добавляем эти же картинки в блок #img_preload, они подгружаются. Пользователь их не видит, т.к. размеры блока 1х1px, плюс он сдвинут вверх и влево за пределы экрана. Код простой, думаю будет понятно.
Код:
<html>
<head>
   <title>Пример</title>
   <script type="text/javascript" src="http://yandex.st/jquery/1.7.1/jquery.min.js"></script>
   <script type="text/javascript">
   $(document).ready(function() {
      $('.zoom').each(function() {
         var src = $(this).attr('href');
         $('#img_preload').append('<img src="/'+src+'">');
      });
   });   
   </script>
   <style>
      #img_preload {
         width: 1px;
         height: 1px;
         overflow: hidden;
         position: absolute;
         top: -100px;
         left: -100px;
      }
   </style>
</head>
<body>

<a href="images/about1.jpg" class="zoom"><img border="1" src="images/about11.jpg" width="250" height="188"></a>
<a href="images/about2.jpg" class="zoom"><img border="1" src="images/about22.jpg" width="250" height="188"></a>
<a href="images/about3.jpg" class="zoom"><img border="1" src="images/about33.jpg" width="250" height="188"></a>

<div id="img_preload"></div>

</body>
</html>

_________________
laex.su
Вернуться к началу
Посмотреть профиль Отправить личное сообщение Посетить сайт автора
Показать сообщения:   
Начать новую тему   Ответить на тему    Список форумов EOMY.NET -> JavaScript, AJAX Часовой пояс: GMT
Страница 1 из 1

 


Rambler's Top100   Рейтинг@Mail.ru    



Powered by phpBB © 2001, 2005 phpBB Group