Проблемы с загрузкой плагина jQuery Cycle

Я использую плагин jQuery Cycle для слайд-шоу изображений. На моей HTML-странице я создаю неупорядоченный список (ul) с именем класса list.

<ul class="slide">
 <li>
   <img src="some_photo.png" />
 <li>
 <li>
   <img src="another_photo.png" />
 <li>
<ul>

На моей HTML-странице я загружаю два javascript в разделе заголовка:

<head>
...
<script  type="text/javascript" src="/common/js/jquery.cycle.all.js"></script>
<script  type="text/javascript" src="/common/js/index.js"></script>

...
</head>

содержимое index.js:

...
 $(function() {
    $('.slide').cycle({               
        fx:'fade', 
        speed: 500, 
        timeout: 3000,
        pager: '.list',
        activePagerClass: 'active',
        pagerAnchorBuilder:function(index, DOMelement){
          return '<li><a href="#"></a></li>'; 
        }
     });
...

Проблема, с которой я сталкиваюсь, заключается в том, что когда я открываю страницу, я сначала вижу изображения, расположенные так, как будто они находятся внутри обычного тега ul (одно поверх другого). Только через несколько секунд кажется, что скрипт трансформирует их в слайд-шоу по желанию. Как я могу инициировать функцию cycle до того, как страница загрузит эти изображения?


jquery jquery-cycle
person Joel    schedule 08.02.2012    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Можете ли вы изменить ul-li с помощью div с тем же идентификатором. Затем вы должны изменить класс img:

<img class="slide" ...

Наконец, добавьте это в CSS:

.slide {
    position: absolute;
    top: 0;
    left: 0;
}

С помощью этого метода изображения будут находиться одно ПОЗАДИ других, а не одно НИЖЕ других, пока скрипт не будет загружен.

person fireb86    schedule 04.05.2012