글쓰기 할때 이미지 이동시 파이어폭스에서 주의 하셔야 할것 같습니다.

블로그에서 글쓰기를할때 처음과 다르게 이미지를 배열을 다시 해야 할때가 있습니다.

예를들어 첫번째 이미지를 사용할려고 했는데, 이 이미지를 3번째로 옮겨야 할때 보통 그 이미지를 지우고, 다시 해당 위치에 첨부하여 이미지를 삽입하는 방식을 쓰시는분도 있고
혹은, 마우스로 이미지를 선택후 드래그 하여 이미지의 위치를 변경하시는분도 있습니다.

얼마전에 제 블로그에 이미지가 x 로 보이지 않는다고 하여 실험을 해본결과 파이어폭스에서 버그가 생기는것을 발견 했습니다.

그럼 어떤식으로 버그가 생기는지 알아보겠습니다. (IE에서는 정상적이니 이용 하셔도 됩니다.)

▶ 아래 사진을 가지고 실험을 할 예정입니다.

일반적으로 본문에 이미지(사진)을 첨부를 한후에 우측에 html을 클릭해서 소스를 보면요

각 이미지는 고유의 이미지 주소를 가지게 됩니다.

[샵샵_1C|cfile8.uf@201E9E374CAE9989B52E58.png|width="530" height="350" alt="" filename="사진.png" filemime="image/jpeg"|_샵샵]<br />

이런식으로 말입니다.

여기까지는 기본적으로 알고 계시는 부분이고요!!


우리는 본문에 이동 시킬 이미지를 원하는 위치로 드래그 하여 이동 해볼까 합니다.

▶ 아래 사진을 클릭한채로 드래그앤 드랍 하여 원하는 위치로 이동 시킵니다.

이렇게 이미지를 마우스로 클릭하여 원하는 위치로 드래그 해주면 아래처럼 이미지가 쉽게 이동됩니다. 어렵지 않죠~  물론 ctrl + c 복사하여 ctrl+v 를 붙이기 해도 됩니다.

이렇게 원하는 위치로 이미지가 이동 되었습니다.

그리고 html을 클릭하여 확인해보면 소스코드도 정상적으로 아래처럼 표현이 됩니다.

이렇게가 정상적입니다.. IE에서는 아주 잘됩니다..
여러분도 IE를 이용하신다면 이렇게 사용하셔도 쉽게 이미지를 원하는 위치로 이동 시킬수 있습니다.

▶ 똑같은 방법으로 파이어폭스에서 해봅니다.

위와 같은 방법으로 똑같이 파이어폭스에서 이미지를 이동시켜 보면,..

위처럼 이미지의 주소가 바뀌었습니다. (위의 핑크색 색상 부분)
글쓰기 화면에서 어떤 이미지든 마우스로 클릭한채로 이미지를 원하는곳으로 이동 시키게 되면 위처럼 주소가 변경됩니다.

해당 주소는 이렇습니다.
<img class="txc-image-c" src="../../../admin/entry/filePreview/cfile25.uf@121E9E374CAE998BB857E3.png" width="530" height="350">

이렇게 바뀌어 버립니다.

재미있는 발견이죠???
그러면 이미지가 편집기 화면이나 미리보기 화면에서 정상적으로 보일까요 ?? 네 보입니다..


그러나 로그아웃 하면요????? 아래처럼.....

안보입니다.. 즉, 파이어폭스에서 티스토리 글쓰기 (편집기)에서 이미지를 이동시키면 이미지 주소가 변경이 되고 관리자(해당 블로거의) 입장에서만 정상적으로 보이며, 로그아웃을 하면 이미지가 보이질 않습니다. 물론 손님이나 다른 블로거에게도 보이질 않습니다.

사라졌습니다..;;

다시 관리자로 로그인 하면요?? 다시 또 보입니다...

그럼으로 관리자의 입장에서는 전혀, 편집에 문제도 없습니다.

원래는 이렇게보여야 하는게 정상이겠죠~

결론을 정리하여 말씀 드리면 위의 기능은 IE에서 하면 아무 문제 없이 이미지가 이동되며 관리자나 손님이든 정상적으로 편집이 가능합니다.

파이어폭스에서 하게되면 이미지의 코드가 변경이 되고, 화면상에서는 문제가 없으나 로그아웃을 하여, 손님의 입장이나, 비로그인 상태라면 해당 이미지가 보이지 않습니다.
때로는 사진이 배꼽으로 보인다고 하더군요!

더불어서, 이렇게 이동되어서 소스가 변경되어진 이미지는 마우스를 이미지에 올려보면 클릭할수 있는게 아니라 그냥 기본 마우스 이미지 포인트로 보여지게 됩니다.

수정되기를 바랍니다.