Машина времени / Coverflow: IMG для DIV

Question

Отличным ресурсом для анимации машины времени, похожей на яблоко, является "космическая галерея": http://www.eyecon.ro/spacegallery

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

К сожалению, это не делается, заключая в тег "img" теги "div" в .html и изменяя "img "to" div "в .js ...: (

У вас есть идея использовать DIV или даже лучшее решение?

Answer 1

Ну, это хороший плагин, надеюсь, автор добавит в него еще несколько методов (или поместит его как github), так что это можно сделать более программно.В настоящий момент, возможно, вам нужно настроить самим spacegallery.js.

Мое минимальное решение - использовать родные элементы div для подписей, расположенные в верхнем левом углу изображений и заимствовать их стили CSS.Вот копия плагина , изменения в spacegallery.js.Используйте какой-нибудь инструмент сравнения, чтобы увидеть изменения.

Я сделал это, чтобы использовать атрибуты изображения alt (добавили их в index.html) в качестве заголовков.Однако это можно сделать многими лучшими способами, это просто основа.Это также не работает после первого цикла, и я не добавил никаких стилей:)