Помощь Несколько картинок в {topnews}

[Rassell]

Подскажите, пожалуйста, как в блоке популярных новостей {topnews} отобразить несколько картинок, чтобы при наведении курсора они переключались?

Мой код из topnews.tpl:

 

[killoff]

Давно уже попадался такой код:

<img class="js-hover" alt="" src="{image-1}" data-images="{image-2},{image-3}">

Далее, вниз, перед закрывающимся тегом

</body>

вставляем:

<script>
//onhover image
$('.js-hover').hover(function() { var _this = this, images = _this.getAttribute('data-images').split(','), counter = 0; this.setAttribute('data-src', this.src); _this.timer = setInterval(function() { if(counter > images.length) { counter = 0; } if (images[counter] != undefined) { _this.src=images[counter]; } else { _this.src=_this.getAttribute('data-src'); } counter++; }, 750);
}, function() { this.src = this.getAttribute('data-src'); clearInterval(this.timer);
});
</script>

 

[Rassell]

Давно уже попадался такой код:

<img class="js-hover" alt="" src="{image-1}" data-images="{image-2},{image-3}">

Далее, вниз, перед закрывающимся тегом

</body>

вставляем:

<script>
//onhover image
$('.js-hover').hover(function() { var _this = this, images = _this.getAttribute('data-images').split(','), counter = 0; this.setAttribute('data-src', this.src); _this.timer = setInterval(function() { if(counter > images.length) { counter = 0; } if (images[counter] != undefined) { _this.src=images[counter]; } else { _this.src=_this.getAttribute('data-src'); } counter++; }, 750);
}, function() { this.src = this.getAttribute('data-src'); clearInterval(this.timer);
});
</script>

На демо-версии сработает? Все никак не могу купить движок .

 

[killoff]

На демо-версии сработает? Все никак не могу купить движок .

это просто js скрипт, от версии ДЛЕ, как и вообще от КМС ДЛЕ не зависит. Можно его на любой странице и CMS ставить, где есть jquery.

 

[Chezzy]

Давно уже попадался такой код:

<img class="js-hover" alt="" src="{image-1}" data-images="{image-2},{image-3}">

Далее, вниз, перед закрывающимся тегом

</body>

вставляем:

<script>
//onhover image
$('.js-hover').hover(function() { var _this = this, images = _this.getAttribute('data-images').split(','), counter = 0; this.setAttribute('data-src', this.src); _this.timer = setInterval(function() { if(counter > images.length) { counter = 0; } if (images[counter] != undefined) { _this.src=images[counter]; } else { _this.src=_this.getAttribute('data-src'); } counter++; }, 750);
}, function() { this.src = this.getAttribute('data-src'); clearInterval(this.timer);
});
</script>

Через ::before и ::after не правильнее сделать будет?

 

[killoff]

Через ::before и ::after не правильнее сделать будет?

приведи пример как через это сделать? Например 10 картинок есть кадров из видео.... и как их вывести так?