Загрузка контента только после открытия

Тема в разделе "Веб-дизайн", создана пользователем acelotuse, 12 окт 2011.

Модераторы: zek24
  1. acelotuse

    acelotuse

    Регистр.:
    31 мар 2009
    Сообщения:
    312
    Симпатии:
    37
    Всем доброго!
    В общем, такой немного странный вопрос.
    На сайте есть спойлеры на 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>
    Буду очень признателен за помощь!
     
  2. bork75

    bork75 The Team

    Регистр.:
    21 июн 2008
    Сообщения:
    1.451
    Симпатии:
    677
    Табы они просто манипулируют стилями.

    Я бы обошёлся вообще без сторонних модулей и jquery.

    Создаём iframe в нужном месте, где должна появится информация.
    Делаем ссылки (табы) и в targete прописываем name нашего фрейма.

    Останется повесить на ссылки javascript чтобы делать видимым iframe по клику
     
    acelotuse нравится это.
  3. acelotuse

    acelotuse

    Регистр.:
    31 мар 2009
    Сообщения:
    312
    Симпатии:
    37
    ну так там jquery итак по умолчанию в движке подключен. Так что в принципе, я стороннего ничего и не подгружаю, разве что этот ява-код.
    Я с iframe не знаком (впрочем, как и с доброй половиной всех остальных премудростей html). Можешь пример какой-нибудь показать?
     
  4. bork75

    bork75 The Team

    Регистр.:
    21 июн 2008
    Сообщения:
    1.451
    Симпатии:
    677
    Вместо ссылок подставляем свои адреса, где будет подгружаемый контент

    Код:
    <a target="my-frame" href="http://htmlbook.ru/">Таб1</a>&nbsp;&nbsp; 
    <a target="my-frame" href="https://www.nulled.cc/">Таб2</a>&nbsp;&nbsp;&nbsp;  
    <a target="my-frame" href="http://rutracker.org/">Таб3</a>
    
    <iframe name="my-frame" width="100%" height="500" frameborder="0" scrolling="no"></iframe>
    
     
    acelotuse нравится это.
  5. gotmeth

    gotmeth Создатель

    Регистр.:
    3 сен 2011
    Сообщения:
    11
    Симпатии:
    3
    как верно сказали выше, табы это лишь манипуляторы, они либо скрывают либо показывают. так что вам в сторону динамически подгружаемого контента. благо в jquery есть все необходимое.

    наводка: ajax
     
    acelotuse нравится это.