Ваш код правильный.
В любом случае, вот пример, надеюсь, это поможет.
https://www.jssor.com/jssordev/problems/image-slider.slider
https://www.jssor.com/jssordev/problems/image-slider.slider/=edit
код вывода такой, как показано ниже:
<a href="#">
<img data-u="image" src="//jssorcdn7.azureedge.net/demos/img/gallery/980x380/004.jpg" />
<div data-t="0" style="position:absolute;top:30px;left:30px;width:500px;height:40px;font-family:Oswald,sans-serif;font-size:32px;font-weight:200;line-height:1.2;text-align:center;background-color:rgba(255,188,5,0.8);">responsive, scale smoothly</div>
</a>
Редактировать
У меня возникла проблема, в новой версии улучшено использование элемента <a>
в качестве целого слайда.Таким образом, вы можете добавить что-нибудь внутри, не скрывая область ссылки.
То есть, поскольку <a>
является слайдом, вы можете удалить родительский элемент <div>
.