NS4: 넷스케입4.x 이상
IE4: IE 4.x 이상
=== 다이내믹 콘텐츠 (문장내용바뀌기) ===
<<NS 4>>
<layer id="alayer"></layer>
<script language="JavaScript1.2">
var thecontents=new Array()
thecontents[0]="안녕하세요!"
thecontents[1]="코리아인터넷닷컴에 오신 것을"
thecontents[2]="환영합니다!"
var current=0
function changecontent(){
document.alayer.document.write(thecontents[current])
document.alayer.document.close()
if (current==2) current=0
else current++
setTimeout("changecontent()",3000)
}
window.onload=changecontent
</script>
<<IE 4>>
<div id="mydiv"></div>
<script language="JavaScript1.2">
var thecontents=new Array()
thecontents[0]="안녕하세요!"
thecontents[1]="코리아인터넷닷컴에 오신 것을"
thecontents[2]="환영합니다!"
var current=0
function changecontent(){
mydiv.innerHTML=thecontents[current]
if (current==2) current=0
else current++
setTimeout("changecontent()",3000)
}
window.onload=changecontent
</script>
=== 요소 옮기기 : onClick()처리 ===
<<NS 4>>
<layer name="space" left=128>
<img src="TN00018A.gif">
</layer>
<script>
function moving(){
if (document.space.left<1000)
document.space.left+=5
moveid=setTimeout("moving()",50)
}
function come_back(){
clearTimeout(moveid)
document.space.left=128
}
</script>
<form>
<input type="button" value="우주선 움직이기" onClick="moving()">
<input type="button" value="원점으로 돌아오기" onClick="come_back()">
</form>
<<IE 4>>
<div id="spaceship" style="position:relative">
<img src="TN00018A.gif">
</div>
<script>
function moving2(){
if (spaceship.style.pixelLeft<1000)
spaceship.style.pixelLeft+=5
moveid2=setTimeout("moving2()",50)
}
function come_back2(){
clearTimeout(moveid2)
spaceship.style.pixelLeft=0
}
</script>
<form>
<input type="button" value="우주선 움직이기" onClick="moving2()">
<input type="button" value="원점으로 돌아오기" onClick="come_back2()">
-----------------------------
"cross-browser" 레이어 만들기
-----------------------------
*cross-browser DHTML : NS와 IE 모두 인식할 수 있는 DHTML
하나의 태그만으로 cross-browser 레이어를 만들 수 있다.
단, 넷스케이프에서 약간의 버그가 있을 수 있다.
NS4는 절대위치를 가지는(absolute position으로 선언된) div를 layer 태그로 만든 레이어처럼 처리한다.
<div id="crosslayer" style="position:absolute"></div>
NS 4는 위의 div를 마치 layer 태그로 만든 레이어처럼 인식한다.
레이어에 액세스하는 것도 layer에서와 똑같아서 document 객체와 함께 레이어 id를 적어주면 된다.
<<NS 4>>
document.crosslayer
IE 4에서는 div id만 사용하면 된다.
<<IE 4>>
crosslayer
이렇게 정의한 레이어가 두 가지 브라우저 사이에 호환되기는 하지만
NS에서는 이런 레이어가 layer 태그로 선언한 레이어처럼 동작하지 못한다.
그러다보니 가끔 브라우저와 충돌할 수도 있고 원치않는 결과가 생길 수도 있다.
----------------------------
사용자 브라우저 체크방법
----------------------------
document.layers 객체를 지원하는 브라우저는 NS 뿐이고
document.all 객체를 지원하는 것은 IE4 뿐이다.
따라서 이런 정보를 알고 있으면 다음과 같이 NS4와 IE4를 체크하는 소스를 만들 수 있다:
if (document.layers)
alert("NS 4+를 사용하고 계십니다!")
if (document.all)
alert("IE 4+를 사용하고 계십니다!")
if (document.layers||document.all)
alert("NS 4 또는 IE 4+를 사용하고 계십니다!")
날짜: 2003-07-23 17:20:45,
조회수: 2000 |