1)
이번에 시도한 부분은 marquee 안에 style="position:absolute;" 를 사용하는 것입니다.

물론, 상대적인 위치를 표시한다고 선언하기 위해,
상위 <div 태그나, 상위 <marquee 태그 내에 position:relative 를 넣었습니다.

...


<marquee width=50 height=20 behavior=alternate scrollamount=2>
<div style="width:150px; height:20px; overflow:hidden; position:relative; background-color:#ffdddd">
<div style="position:absolute; left:0px; top:0px;">1</div>
<div style="position:absolute; left:100px; top:10px;">2</div>
</div>
</marquee>

<marquee width=50 height=20 behavior=alternate scrollamount=2 style="position:relative; background-color:#ddddff">
<div style="position:absolute; left:0px; top:0px;">1</div>
<div style="position:absolute; left:100px; top:10px;">2</div>
</marquee>


...



1
2
1
2



...

-- 새 창에서 보기 --

이 화면 내에서 보는 모습과, 새 창에서 보는 모습,
브라우져별로 보는 모습이 다 다르네요.

2)
에디터(IE8 사용)에서 보면
- 빨간 부분 크기가 150 이라 그런지, 파란색을 중심으로 삼등분 되어있습니다.

..

3)
IE8, Chrome, Safari 로 블로그를 보면 
-  파란쪽 부분 스크롤이 살짝 되는 듯 싶기는 한데.. 파란쪽 타이밍이 조금 더 짧네요.

FireFox 로 블로그를 보면
- 파란쪽 스크롤이 전혀 안되고 있네요. absolute 라서 공간 크기를 허용하지 않는 분위기랄까요.. 글자 2 가 marquee 화면 밖으로 삐져나와있습니다.

Opera 로 블로그에서 보면
- marquee 가 위아래로 나뉘어져있네요. (다른 브라우져는 좌우로 나뉘어져 있음.) marquee 밖으로 문자가 나가지는 않았고, 스크롤도 되지 않습니다.

..

4)
IE8 로 새 창에서 보면
- 파란쪽과 빨간쪽 스크롤 타이밍은 비슷해보이는데, 파란쪽 스크롤 되는 거리가 짧아보입니다.

Chome, Safari 로 새 창에서 보면
- 블로그에서 보는 모습과 크게 다르지 않네요. 파란쪽 타이밍이 조금 더 짧습니다.

FireFox 로 새 창에서 보면..
- 읔.. document.close() 적용을 안해서 그런가요.. marquee 작동이 아얘 안되네요. (블로그 스킨 수정완료)
- 블로그에서 보는 모습과 같네요. 파란쪽 스크롤이 전혀 안되고, 글자 2가 marquee 화면 밖으로 삐져나와있습니다.

Opera 로 새 창에서 보면..
- 블로그에서 보는 모습과 같네요. marquee 가 위아래로 나뉘어져 있고, 스크롤도 안되고, 삐져나오지도 않았습니다.

...

5)
아마도.. 블로그 자체내에 가지고 있는 CSS default 값이나,
marquee 처리기준 때문인 것 같다는 생각은 해봅니다.

.. 거기에, position:absolute 에 관한 기준을 나타낼 수도 있겠구요.

6)
물론, 이런 방법의 test 는,
"빨간색쪽 방법이 표준화된 표시 방법이다"를 알리기 위한 것이긴 합니다만..

가끔씩은, 이런 트릭도 쓰고싶을 때가 있으까요.

easyBow killofki@.

Posted by killofki
,