텍스트 내의 부동 이미지

텍스트 내에서 이미지 (실제로는 최종 결과에 플래시 배너)를 플로팅해야하지만 각각 다른 CMS에서 도착해야합니다. 그래서 내 DOM 결과는 다음과 같습니다 :텍스트 내의 부동 이미지

<img src="" alt=""/> 
<p>All text here</p>

이미지가 텍스트 내에서 플로트되도록 클라이언트 측 방법을 사용하고 있습니까? 마크 업이 같은 것처럼 을 (그래서 바닥에 조금있을 것입니다하지만 여전히 텍스트 랩핑이) : http://jsfiddle.net/F3ZyF/5/

http://jsfiddle.net/audetwebdesign/Q2ADA/ 당신이 두 번째 코드에서 제시 한 내용을 마크 업을 실제로 시도? – TylerH

이 경우,'img' (또는 배너) 엘리먼트를 DOM 아래로 배치하기위한 JavaScript가 필요합니다. –

해결되었습니다! 고마워, 마크. Jquery에서 insertAfter()를 사용했습니다. –

: 나는 몇 가지 예를가는 시도하고 얻을 수있는 바이올린을 사용

<p>Star of text</p> 
<img src="" alt=""/> 
<p>End of text</p>

시도 <p>Start of Text<img src="" alt="" style="align:bottom;">End of Text</p> 알림 style="align:bottom;을 추가하고 img 태그를 p 태그 안에 넣었습니다.

banner_wrap = $(".article-box-banner-wrap").detach(); 
$(".article-text p").first().after(banner_wrap);

는 DOM에서 배너 요소를 제거하기 위해 .detach() 기능을 사용하여 다음 첫 번째 p 후 배너를 다시 삽입 .after() (또는 유사)를 사용 :

2014-06-09 15:00:17 Jonco98

OP가 직면 한 문제는 이미지/배너가 마크 업 (컨트롤 외부)에 처음 나타나고 다른 곳에 배치하려고한다는 것입니다. CSS는 물론 작동하지만 JavaScript/jQuery를 사용하여 DOM을 조작해야 이미지/배너를 새로운 위치에 배치 할 수 있습니다. –

는 여기에 jQuery를 기반 솔루션의 내 버전입니다.

참조 데모 :

2014-06-09 15:02:39

답변