Создание изображения заголовка из альта сценария

Я пытаюсь использовать этот скрипт JQuery, чтобы сделать заголовок изображения из альт тега:Создание изображения заголовка из альта сценария

$("#content img").each(function() { 
    var $this = $(this); 
    var title = $this.attr("alt"); 
$this.after('<div class="caption">'+ title +'</div>'); 
});

Я использую другой скрипт JQuery перед ним, и он работает нормально. Кажется, я не могу заставить надпись на скрипт работать.

Пример: www.cslack.com/test.html

Спасибо,

Роберт

источник

2009-12-08 Robert C.

От взгляда на вашу примерную страницу вы должны добавить абсолютный стиль позиции в тег '' или еще лучше, чем обертка вокруг каждой ссылки, которая обертывает изображение. Таким образом, когда вы добавите надпись, она также будет расположена в том же месте, что и изображение. – Mottie

$(function(){ 

    $('a > img[style]').each(function(){ 
     $el = $(this); 
     var style = $el.attr('style'); 
     $el.attr('style',''); 
     $el.parent().attr('style',style); 
    }); //Moves the inline styles 

     $("img").each(function(){ 
      var title = this.alt; 
      $(this).after('<div class="caption">'+ title +'</div>'); 
     }); //Adds the dynamic captions. 
});

источник

2009-12-08 03:40:00 CodeJoust

Нет, не используйте 'append' вместо' after'. Вызов 'append' поместит' div' _inside_ '' тег, который не то, что он хочет. – SLaks

Спасибо. В следующий раз, я посмотрю на демо-страницу ... – CodeJoust

Спасибо, ребята, за вашу помощь. Я все еще не в состоянии заставить его работать. Я довольно новичок в этом. Не могли бы вы еще раз взглянуть? –

На вашем примере страницы, нет такого понятия, как #content, поэтому он не работает ,

Если вы разместите <div id="content"> вокруг своего контента, тогда он должен работать.

источник

2009-12-08 03:39:47

+1 для быстрого поиска, альтернативно (и, вероятно, немного лучшего решения в этом случае), вы можете просто удалить #content и просто оставить $ ("img"), который выберет каждый img на странице. – Jay

Ваша проблема в том, что вы выполняете свой код до того, как изображения существуют.

Вам необходимо обернуть код в $(function() { code }), чтобы он запускался после загрузки документа.

В качестве альтернативы вы можете переместить блок <script> в конец тега <body> после тегов img.

Кроме того, ваш HTML не имеет элемента #content; вам нужно либо сменить селектор на img, либо поместить все теги <img> внутри <div id='content'>.

источник

2009-12-08 03:40:14 SLaks

Создание изображения заголовка из альта сценария

ответ

Смежные вопросы