Как загрузить картинку при display:block; используя всем известный плагин lazyload

[raindew]

Доброго времени суток дамы и господа!)
Использую плагин jquery.lazyload.js для последовательной загрузки изображений на странице при прокрутки (скроллинге).
Появилась задача и заключается она вот в чем:
Допустим, есть некий блок и он скрыт с помощью (display:none. Когда мы на него наводим, то none заменяется на block и нужно, чтобы в это время загружались картинки, используя, jquery.lazyload.js - этот скрипт. Возможно ли сие действие? Спасибо!)

[BETEPAH]

Возможно ли сие действие?

Нет. Если блок скрыт display:none, на него можно навести только порчу. А курсор навести не получится, не на что наводить.

[рони]

display:none. Когда мы на него наводим

офигеть!!!

[raindew]

Да, очень смешно) Не много перепутал) Вот код:

#photo {border;1 px solid black;height:100px;}
#photo:hover .photo-small {display:block;}
#photo .photo-small {display:none;}

<div id='photo'>
<div class='photo-big'>
<img class='lazy' data-original=''>
</div>
<div class='photo-small'>
<img class='lazy' data-original=''>
<img class='lazy' data-original=''>
<img class='lazy' data-original=''>
<img class='lazy' data-original=''>
</div>
</div>

Как в таком случае загружать картинки при появлении блока "photo-small"?

[devote]

используя всем известный плагин lazyload

не имею никакого понятия о нем...

[raindew]

Может быть тогда знаете что-нибудь иное? Нужно, чтобы картинки (товары) на странице загружались только тогда, когда они в зоне видимости.

[BETEPAH]

mouseenter/mouseleave на блоке #photo. Темы с этими событиями каждый день на форуме вентилируются
А почему не сделать предзагрузку мелких изображений?

[рони]

raindew,
а так пробовали?

$("img.lazy").lazyload({ 
    skip_invisible : false
});

[raindew]

рони, skip_invisible:false, как никогда, кстати) Не знаешь, можно ли с помощью этого плагина прикрутить еще какой-нибудь блок с текстом, чтобы он появлялся только тогда, когда мы его видим? То есть, при прокрутке скролла.
BETEPAH, подскажете как?)

[danik.js]

не имею никакого понятия о нем...

Я слыхал, но узнав что под него нужно удалять все картинки, делая из них непонятные пустышки - отказался использовать. Иначе сеошник бы повешал.

Кстати, недавно видел статью на хабре, не помню название. Так вот, эта статья навеяла прекрасное решение для lazy load:

<script> document.write('<plaintext>') </script>
блок картинок
<script> document.write('</plaintext>') </script>

Далее скриптом получаем содержимое plaintext, парсим через DOMParser, удаляем src картинок и вставляем результат вместо временного plaintext.

Круто ведь? Та статья на хабре была о плагине, который целиком обрамлял всю страницу в plaintext, я думаю это слишком громоздко и создает некоторые проблемы, а вот такое короткое решение - самое оно.
Недостаток только в необходимости расставлять скрипты.