새 줄 문자가 jquery에 의해 올바르게 렌더링되지 않습니다.

Question

이미지에 텍스트를 하나씩 표시합니다. 그래서 각 줄에는 <BR> 태그가 있지만 jquery를 사용하여 이미지에 텍스트가 표시되면 BR이 제대로 번역되지 않고 오히려 빈 공간이 페이지 맨 위에 오게됩니다. 여기 내 스크립트

내가 한 이후에 이미지에 텍스트를 표시 할 때 텍스트 줄 바꿈을 표시 할 수 없다는하고

<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); 

입니다. 도와주세요. 감사합니다

Answer 1

선택자에 문제가 있습니다.

첫째, .HeaderMsg1 :first-child로 변환 (정말 .HeaderMsg1:first-child으로 동일하지 .HeaderMsg1 *:first-child, 인) : 후도 부모로부터 first-child입니다 그 아래에있는 모든 요소를 ​​얻을,

.HeaderMsg1 찾기 (어떤 부모도 될 수 있음). 그 결과는 모두 span과 br 요소가되며, 결과적으로 첫 번째 간격에 br이 추가됩니다.

저는 실제로 당신이 후일에 끼친 영향을 줄 수있는 '.HeaderMsg1 span:first-child' (또는 비슷한 것)이라고 생각합니다.

예 : 아이디어는 각 "HeaderMsg"후 간격을 필요로한다는 것입니다 http://jsfiddle.net/49kvB/