acelotuse
Профессор
- Регистрация
- 31 Мар 2009
- Сообщения
- 312
- Реакции
- 37
- Автор темы
- #1
Всем доброго!
В общем, такой немного странный вопрос.
На сайте есть спойлеры на jquery (сайт на ДЛЕ-двиге). Если загрузить страницу, то содержимое спойлеров не загружается сразу, а только после того, как спойлер открыть. Т.е. я могу спрятать в спойлер все большие изображение и предупредить, что под спойлером большой траффик.
И вот мне приходится сделать на сайте табы на том же jquery. Табы замечательные, но один недостаток: загружается вся информация из всех табов. Т.е. если у меня несколько табов, и под первым из них текстовая информация, а под другим - сотня изображений, то грузится не просто текст, а по клике по следующему - и изображения, а сразу все. Естественно, пользователю со слабым каналом (а у меня их много) открывать страницу будет гемморно.
В общем, окончательный вопрос таков: как сделать, чтобы информация из скрытых табов подгружалась только по клику на табе, а не сразу при загрузке страницы?
вот ява-код, который переключает табы:
Буду очень признателен за помощь!
В общем, такой немного странный вопрос.
На сайте есть спойлеры на jquery (сайт на ДЛЕ-двиге). Если загрузить страницу, то содержимое спойлеров не загружается сразу, а только после того, как спойлер открыть. Т.е. я могу спрятать в спойлер все большие изображение и предупредить, что под спойлером большой траффик.
И вот мне приходится сделать на сайте табы на том же jquery. Табы замечательные, но один недостаток: загружается вся информация из всех табов. Т.е. если у меня несколько табов, и под первым из них текстовая информация, а под другим - сотня изображений, то грузится не просто текст, а по клике по следующему - и изображения, а сразу все. Естественно, пользователю со слабым каналом (а у меня их много) открывать страницу будет гемморно.
В общем, окончательный вопрос таков: как сделать, чтобы информация из скрытых табов подгружалась только по клику на табе, а не сразу при загрузке страницы?
вот ява-код, который переключает табы:
HTML:
<script type="text/javascript">
$(function() {
$('ul.i-tab li:first').addClass ('active');
$('ul.tab-content li:first').css ('display', 'block');
$('ul.i-tab').delegate('li:not(.active)', 'click', function() {
$(this).addClass('active').siblings().removeClass('active')
.parents('.tabs').find('ul.tab-content li.t').hide()
.eq($(this).index()).fadeIn('slow');
})
})
</script>