이미지 여러개 첨부시 공백 띄우기

이미지 여러개를 한번에 본문 삽입시 작은 사이즈의 이미지는

옆으로 붙어 나옵니다.

큰 이미지는 밀려서 밑으로 나오지만 이미지와 이미지 사이에 글을 쓸수가 없습니다.

이미지 클릭하고 오른쪽으로 한번 누른뒤 엔터 쳐주면 쓸수 있지만

번거로운 작업이죠.

 

modules/editor/tpl/js/uploader.js 파일을 좀 손봐주시면 쉽게 해결됩니다.

 

temp_code += " />\r\n"; 이 부분을 찾아 가고 아래 내용으로 고쳐주세요.

 

temp_code += " /></p>"; 이렇게요.

 

 

 

위에 방법은 파폭, 크롬에서 적용이 안된다는걸 확인했습니다. 확인 결과 파폭이나 크롬에서는 </p> 태그를 사용해도

내용이 없으면 그냥 채워지는거 같아 검색좀 해보니 레이어를 사용해야 한다고 하더군요.

그래서 브라우저 체크후 익스플로러일때는 위에 방식을 사용하고 그외의 브라우저 일때는 레이어안에 br 태그를

넣어서 해결하였습니다.

temp_code += " />\r\n"; 이 부분을 아래처럼 고쳐주시면 됩니다.

                if (navigator.appName == 'Microsoft Internet Explorer'){
                    //익스플로러일때
                    temp_code += " /></p>";
                }
                else { //기타 다른 브라우저
                    temp_code += " /><div><br></div>";
                }

테스트 브라우저는 익스플로러8, 크롬5, 파이어폭스 3.6.8 입니다.

익스에서도 레이어에 br 넣는게 가능하지만 익스에서는 두칸이 뛰어지고 다른거에서는 한칸이 뛰어지기 때문에

저렇게 브라우저 체크를 했구요.

두칸, 한칸 상관 없으시다면 temp_code += " /><div><br></div>"; 이것만 넣으셔도 됩니다.

 

 

그런데 제 경우에는

temp_code += " />\r\n";  이 부분을 아래와 같이 수정을 해도 똑같은 효과를 보았습니다.

 

temp_code += " />\r\n\n";  이렇게 \n을한 번 더 넣어주는 것이지요.