Доброго всем! Суть - есть слайдер (галерея товара по клику), и несколько изображений с прописанными альтами. Хотелось минимальными движениями вывести альтернативный текст над изображением, в качестве пояснения..
На другом форуме пытался решить данную задачу,
изначально средствами css+html. В ряде своих экспериментов, и по советам других ничего "рабочего" не получилось.
Обратился к js + помощь со стороны = родился вот такой инвалид:
codepen
Костыли.
Этот скрипт:
$('.img img').load(function () {
$(this).before($('<div id="alt-tx">').html($(this).attr('alt')));
})
Создает
Код:
|
<div id="alt-tx">с помещенным внутрь альт. текстом выбранного изображения</div> |
перед img, и создает по каждому клику на превьюшки слайдера и до бесконечности..
Получается вот так:
Это не позволяет сделать прозрачность, и вообще не есть хорошо..
Как можно дополнить js, чтобы скрипт при событии клика на превью, удалял предыдущий созданный <div id="alt-tx">?