Случайно отображать изображения с помощью jQuery - PullRequest
Новая
       14

Случайно отображать изображения с помощью jQuery

0 голосов
/ 13 мая 2011

У вас есть набор изображений: 

<ul class="thumb">
    <li><a href="#">
        <img src="images/att.jpg" title="Store AT&T" alt="" /></a></li>
    <li><a href="#">
        <img src="images/images%20(10).jpg" title="Store Wiki" alt="" /></a></li>
    <li><a href="#">
        <img src="images/nintendo.jpg" title="Store Nintendo" alt="" /></a></li>
    <li><a href="#">
        <img src="images/images%20(11).jpg" title="Store WorldConference" alt="" /></a></li>
    <li><a href="#">
        <img src="images/images%20(13).jpg" title="Store GoeSystem" alt="" /></a></li>
    <li><a href="#">
        <img src="images/images%20(14).jpg" title="Store Something" alt="" /></a></li>
    <li><a href="#">
        <img src="images/images%20(3).jpg" title="Store Lego" alt="" /></a></li>
    <li><a href="#">
        <img src="images/images%20(4).jpg" title="Store Something" alt="" /></a></li>
    <li><a href="#">
        <img src="images/images%20(3).jpg" title="Store Lego" alt="" /></a></li>
</ul>

Я хочу .fadeIn() изображения в случайном порядке. Я попробовал решение, данное здесь , но мой .children().length всегда почему-то равен 0.

Как я могу это исправить?

Ответы [ 2 ]

1 голос
/ 13 мая 2011

Обновление вашей скрипки:

http://jsfiddle.net/jKtfZ/44/

В селекторе символ > означает прямой дочерний элемент. Следовательно, #container > img ничего не вернет. Теги img не являются прямыми потомками #container.

РЕДАКТИРОВАТЬ: также, не уверен, почему вы добавили 3 при создании случайного числа

EDIT2: аналогично, $('#container').children().length; даст вам прямых потомков #container, то есть элементов <li>, а не img.

0 голосов
/ 13 мая 2011

Какой селектор вы использовали до .children().length? Вам следует искать имя вашего класса, так как вы не указали этому элементу идентификатор: 

$(".thumb").children().length

Или присвоить ему идентификатор: 

<ul class="thumb" id="container">
    <li><a href="#">
        <img src="images/att.jpg" title="Store AT&T" alt="" /></a></li>
    <li><a href="#">
        <img src="images/images%20(10).jpg" title="Store Wiki" alt="" /></a></li>
    <li><a href="#">
        <img src="images/nintendo.jpg" title="Store Nintendo" alt="" /></a></li>
    <li><a href="#">
        <img src="images/images%20(11).jpg" title="Store WorldConference" alt="" /></a></li>
    <li><a href="#">
        <img src="images/images%20(13).jpg" title="Store GoeSystem" alt="" /></a></li>
    <li><a href="#">
        <img src="images/images%20(14).jpg" title="Store Something" alt="" /></a></li>
    <li><a href="#">
        <img src="images/images%20(3).jpg" title="Store Lego" alt="" /></a></li>
    <li><a href="#">
        <img src="images/images%20(4).jpg" title="Store Something" alt="" /></a></li>
    <li><a href="#">
        <img src="images/images%20(3).jpg" title="Store Lego" alt="" /></a></li>
</ul>

Тогда вы можете использовать идентификатор селектора: 

$("#container").children().length
...