新行字符無法正確呈現jquery

我在圖像上一次性顯示文字。所以每行都有<BR>標籤，但是當使用jquery在圖像上顯示文本時，BR沒有正確翻譯，而空白空間正在頁面的頂部。這裏是我的腳本新行字符無法正確呈現jquery

<div id="HeaderMessage" class="HeaderMsg1"> 
<span class="HeaderMsg">A LIFETIME WARRANTY FOR EVERY PART WE REMANUFACTURE.<br/>We reengineer the faults out of parts so they won't fail again. Guaranteed.</span> 
<span class="HeaderMsg">PROFIT FROM ENGINEERING EXPERTISE.<br/>We offer you reliable parts, low prices and easy access to automotive knowledge.</span> 
<span class="HeaderMsg">JOIN US FOR A CAREER THAT CAN TAKE YOU FURTHER, FASTER. <br/>Reengineer your future with a world leader in the remanufacture of electronic automotive parts.</span> 
<span class="HeaderMsg">THE SENSIBLE CHOICE IS THE GREENER CHOICE TOO.<br/>Our parts save precious raw materials, reduce automotive waste and require less CO2 to produce. </span> 
</div> 

$('.HeaderMsg1 span:gt(0)').hide(); 
    setInterval(function() { 
    $('.HeaderMsg1 :first-child').fadeOut() 
    .next('span').fadeIn() 
    .end().appendTo('.HeaderMsg1'); 
}, 5000);

我沒有能夠顯示在一前一後圖像上的文字時顯示的文本換行。請幫助我。謝謝

來源

2012-02-16 Thomas

如果這個想法是，你需要在每個「HeaderMsg」後間距，你應該添加一些CSS，使該類顯示爲塊，並給它一些尺寸和填充。根據你的描述，這個問題並不明顯，或者你有/沒有 – SpaceBison 2012-02-16 13:22:08

你的'
'可能無法正常工作，因爲你可能（取決於你的文檔類型）需要一個'
'。或者做@SpaceBison所說的並使用CSS，這是一種更清潔的方法。 – Chris 2012-02-16 13:37:58

@Chris - 如果沒有空格，
應該沒有問題。 – SpaceBison 2012-02-16 13:41:52

您的選擇器有問題。

首先，.HeaderMsg1 :first-child（這確實是.HeaderMsg1 *:first-child，這是不一樣的.HeaderMsg1:first-child）轉換爲：

查找.HeaderMsg1，之後得到駐留下的任何元素，這也是一個first-child從它的父（可以是任何父母）。這將導致所有span和br元素，導致所有br被添加到第一個時間間隔。

我相信你真的是'.HeaderMsg1 span:first-child'（或類似的東西），這應該會給你後面的效果。

例如： http://jsfiddle.net/49kvB/

來源

2012-02-16 13:45:23 Niklas

感謝你的代碼工作，但老實說，我只是不明白你描述問題的方式。如果你更詳細地描述這個問題會更好......我的代碼中有什麼問題。感謝你的搖滾。 – Thomas 2012-02-16 14:10:46

@Thomas您的選擇器未選擇您想要選擇的項目。刪除間隔，做一個'console.log（「$（'。HeaderMsg1：first-child'）」）;'看看它實際選擇了什麼，然後執行appendTo並查看結果是什麼。這只是你正在選擇的元素的一個問題 – Niklas 2012-02-16 14:25:35

我想$（'。HeaderMsg1：first-child'）選擇父div中的第一個跨度？當
進入場景，然後問題發生之前，它工作正常。你可以討論爲什麼問題發生在
帶有跨文本文本。 – Thomas 2012-02-16 18:42:14

新行字符無法正確呈現jquery

回答

相關問題