Есть ли разумный способ сделать это? Он не должен работать во всех браузерах, поскольку он только дополняет, но я задавался вопросом, есть ли быстрый способ обойти это.
Я использую Cycle2 для создания слайдера, который имеет титры, которые поступают из альт-текста. Например:
<img src="images/data/sports/netball.png" alt="Netball">
Это отображает подпись под значком с "Netball".
В настоящее время все это может быть только один цвет (по умолчанию черный), поскольку они используют один и тот же класс для каждого заголовка, когда он прокручивается.
<div id="alt-caption" class="center"></div>
Я действительно не хочу начинать взламывать код, поскольку он работает очень хорошо, но я думал, что было бы хорошо сделать каждый заголовок другим цветом текста, чтобы соответствовать цвету значка.
Есть ли способ сделать это? например, используя Javascript, возьмите данные внутри alt (например, возьмите "Нетбол" и сделайте так, чтобы он помещал это в класс заголовка, чтобы он читал:
<div id="alt-caption" class="center Netball"></div>
Поскольку они постоянно меняются, необходимо заменить "netball" classname на alt для следующего значка (например, "футбол")
Живой пример см. В разделе спорта: http://fh80.student.eda.kent.ac.uk/fyp/#
Как это?
var className = $('img').attr('alt');
$('#alt-caption').addClass(className);
Не знаете, какой может быть селектор на вашем изображении, поскольку img
довольно глобальный? Возможно, у него есть родитель с уникальным идентификатором?
Смотрите мою скрипку для основной демонстрации
$("img").attr("alt")
и$("#alt-caption").removeClass();
+$("#alt-caption").addClass(gottenAltAttr)
+$("#alt-caption").addClass("center")
(или вы можете вспомнить последний добавленный класс, чтобы вы могли заменить этот класс на только новый)