2010-04-26 3 views
1

Я использую плагин galleria jQuery на сайте. Когда галерея сначала загружается, все изображения появляются кратко & по вертикали, т.е. 7 & 8. Этого не происходит, когда я изолирую галерею, только когда я положил ее на несколько тяжелую страницу. Это заставляет меня думать, что это происходит, когда страница немного медленнее загружать.Плагин Galleria jQuery кратко показывает все изображения в IE 7 и 8

Кто-нибудь знает, как это исправить? Я чувствую себя как переполнение: скрытый должен это исправить, но я применил его вместе с высотой в каждом контейнере, о котором я мог думать.

У кого-нибудь есть идеи?

Вот мой CSS:

.galleria{list-style:none;width:350px; overflow:hidden; height: 70px;} 
.galleria li{display:block;width:50px;height:50px;overflow:hidden;float:left;margin:4px 10px 20px 0;} 
.galleria li a{display:none;} 
.galleria li div{position:absolute;display:none;top:0;left:180px;} 
.galleria li div img{cursor:pointer;} 
.galleria li.active div img,.galleria li.active div{display:block;} 
.galleria li img.thumb{cursor:pointer;top:auto;left:auto;display:block;width:auto;height:auto} 
.galleria li .caption{display: inline;padding-top:.5em; width: 300px; } 
* html .galleria li div span{width:350px;} /* MSIE bug */ 

HTML:

  <ul class="gallery"> 
      <li class="active"><img src="1.jpg" cap="A great veiw by so and so. This is a long block of info.<br /><span style=color:#666;>Photo by: Billy D. Williams</span>" alt="Image01"></li> 
      <li><img src="2.jpg" cap="A mountain <span style=color:#666;>Photo by: Billy D. Williams</span>" alt="Image01"></li> 
      <li><img src="3.jpg" cap="Another witty caption <span style=color:#666;>Photo by: Billy D. Williams</span>" alt="Image01"></li> 
      <li><img src="4.jpg" cap="<span style=color:#666;>Photo by: Billy D. Williams</span>" alt="Image01"></li> 
      </ul> 

ответ

0

Я выяснил решение. Если вы установили .gallery li img {display: none}, это ненадолго скроет стек изображений в момент, прежде чем jQuery переопределит его.

0

как о

.galleria li{display:none} 
.galleria li.active{display:block} 

редактировать: хмм, не зная, как вы хотите, чтобы галерея работать,

.galleria li{float:left;width:120px;} 

так просто выстроить красиво горизонтально

+0

Неплохая мысль, но это не только не работает, но и скрывает все, кроме активных миниатюр. Как работает этот подключаемый модуль, миниатюры представляют собой просто измененные версии большого изображения, поэтому их нельзя настроить для отображения: none. Спасибо хоть. – user279860

+0

. .galleria li уже размещен слева и не имеет отношения к исходной проблеме. – user279860