jquery append - 圖像內嵌

我想添加圖像到div。當圖像附加。正在顯示「塊」。我需要它們以內聯方式顯示。jquery append - 圖像內嵌

這是我運行的代碼：

$(".showvideothumbs").append($('<img src="/garageimages/'+data.thumb+'" style="display:inline">').hide().fadeIn(2000));

我試過在具有「顯示：內聯」一個div包裹它集，但jQuery的改變，爲「顯示：塊」。

來源

2011-07-25 Jason Small

使用回調。

$(".showvideothumbs").append('&lt;img src="/garageimages/'+data.thumb+'" style="display:none;"/&gt;').find('img').fadeIn(2000,function(){ 
    $(this).css('display', 'inline'); 
});

來源

2011-07-25 09:55:27 Darm

完美的作品！ –

在下面閱讀我的評論。 – Darm

，而不是內嵌樣式嘗試

.css('display', 'inline')

來源

2011-07-25 09:07:32 Viller

我嘗試添加它喜歡：$（「showvideothumbs」）附加（$（ '

jQuery使用「display：block」css值來處理fadeIn動畫。您必須使用回調函數來更新動畫結尾處的css值。看到我的答案。 – Darm

我作爲一個小困惑，爲什麼你這樣做：

$('<img src="/garageimages/'+data.thumb+'" style="display:inline">').hide().fadeIn(2000)

你，實際上，創建一個圖像，然後隱藏和在它被添加到DOM之前顯示它。

使用.css('display', 'inline')更有效地爲您設置樣式嗎？

$(".showvideothumbs").append($('<img src="/garageimages/'+data.thumb+'" style="display:inline">').css('display', 'inline'));

然後，您可以將隱藏/淡入淡出的含DIV（格式化爲更易於閱讀）：

$(".showvideothumbs") 
    .append($('<img src="/garageimages/'+data.thumb+'" style="display:inline">') 
     .css('display', 'inline')) 
    .hide().fadeIn(2000);

來源

2011-07-25 09:10:54

我這樣做，以便我可以加載隱藏的圖像，然後淡入它。您的解決方案工作，除了它隱藏整個div，然後淡入，但你內聯解決方案確實工作。 –

jquery append - 圖像內嵌

回答

相關問題