메뉴 건너뛰기

tnt_lang

html/script 스크롤바를 따라다니는 이미지

박상현 2003.12.04 13:39 조회 수 : 1666 추천:27

<HTML>
<HEAD>
<title>스크롤바를 따라다니는 이미지</title>

<SCRIPT language="javascript">
<!--
//============ 아래 변수 값은 변경할 수 있습니다 ===============
imageSource = "http://my.dreamwiz.com/zinah/study/s_img/cake.gif"
imageWidth = 52
imageHeight = 46
imageAlign = "bottomright" //topright, topleft, bottomright, bottomleft
linkTo = "http://my.dreamwzi.com/zinah"

//============ DO NOT EDIT THE CODES BELOW ============

n = (document.layers) ? 1:0
ie = (document.all) ? 1:0

function init() {
if (n || ie) {
// initialize objects
createLayer("watermark",null,0,0,imageWidth,imageHeight,"<A HREF='" + linkTo + "'><IMG SRC='" + imageSource + "' BORDER=0></A>")
mark = new dynLayer("watermark")
setInterval("wtrmark()",100)
}
}

function dynLayer(id,nestref) {
if (n) {
this.css = document.layers[id]
}
else if (ie) {
this.css = document.all[id].style
}

this.moveBy = dynLayerMoveBy
this.moveTo = dynLayerMoveTo
}

function dynLayerMoveBy(x,y) {
this.x += x
this.css.left = this.x
this.y += y
this.css.top = this.y
}
function dynLayerMoveTo(x,y) {
this.x = x
this.css.left = this.x
this.y = y
this.css.top = this.y
}

function wtrmark() {
if (n) {
windowWidth = window.innerWidth-17
windowHeight = window.innerHeight-17
if (imageAlign == "topleft") mark.moveTo(window.pageXOffset,window.pageYOffset)
if (imageAlign == "topright") mark.moveTo(windowWidth-imageWidth+window.pageXOffset,window.pageYOffset)
if (imageAlign == "bottomleft") mark.moveTo(window.pageXOffset,windowHeight-imageHeight+window.pageYOffset)
if (imageAlign == "bottomright")mark.moveTo(windowWidth-imageWidth+window.pageXOffset,windowHeight-imageHeight+window.pageYOffset)
}

else if (ie) {
windowWidth = document.body.clientWidth
windowHeight = document.body.clientHeight
if (imageAlign == "topleft") mark.moveTo(document.body.scrollLeft,document.body.scrollTop)
if (imageAlign == "topright") mark.moveTo(windowWidth-imageWidth+document.body.scrollLeft,document.body.scrollTop)
if (imageAlign == "bottomleft") mark.moveTo(document.body.scrollLeft,windowHeight-imageHeight+document.body.scrollTop)
if (imageAlign == "bottomright")mark.moveTo(windowWidth-imageWidth+document.body.scrollLeft,windowHeight-imageHeight+document.body.scrollTop)
}
}

function createLayer(id,nestref,left,top,width,height,content,bgColor,visibility,zIndex) {
if (n) {
if (nestref) {
var lyr = eval("document."+nestref+".document."+id+" = new Layer(width, document."+nestref+")")
}
else {
var lyr = document.layers[id] = new Layer(width)
eval("document."+id+" = lyr")
}
lyr.name = id
lyr.left = left
lyr.top = top
if (height!=null) lyr.clip.height = height
if (bgColor!=null) lyr.bgColor = bgColor
lyr.visibility = (visibility=='hidden')? 'hide' : 'show'
if (zIndex!=null) lyr.zIndex = zIndex
if (content) {
lyr.document.open()
lyr.document.write(content)
lyr.document.close()
}
}
else if (ie) {
var str = 'n<DIV id='+id+' style="position:absolute; left:'+left+'; top:'+top+'; width:'+width
if (height!=null) {
str += '; height:'+height
str += '; clip:rect(0,'+width+','+height+',0)'
}
if (bgColor!=null) str += '; background-color:'+bgColor
if (zIndex!=null) str += '; z-index:'+zIndex
if (visibility) str += '; visibility:'+visibility
str += ';">'+((content)?content:'')+'</DIV>'
if (nestref) {
index = nestref.lastIndexOf(".")
var nestlyr = (index != -1)? nestref.substr(index+1) : nestref
document.all[nestlyr].insertAdjacentHTML("BeforeEnd",str);
}
else {
document.body.insertAdjacentHTML("BeforeEnd",str)
}
}
}
//-->
</SCRIPT>
</HEAD>

<BODY ONLOAD="init()">

<table width="400" border="0" cellspacing="0" cellpadding="5">
<tr>
<td width="400" heigth="234" valign="top">
<b>야외 도시락을 준비할 때 주의할 점 </b><font color="#009900">(www.menupan.com 에서 발췌)</font><br><br><br>
<img src="http://my.dreamwiz.com/zinah/study/s_img/cook.jpg" height="100" align="right" hspace="5" width="100" border="1">
집에서 정성들여 준비한 도시락이 몇 시간 지나면… 금방… 상해버리잖아요… 모양도 많이 변하고.. 색깔은 또 어떻구요.. <br><br>

<font color="#0066CC">1. 도시락은 찬 음식이 중심</font><br><br>음식은 그 요리에 알맞은 온도에 먹어야 제맛. 아무리 도시락 보온성이 좋더라도 식게 마련이므로 가급적 더운 음식은 피하는게 좋다. <br><br>
<font color="#0066CC">2. 요리는 90%는 완성</font><br><br>집에서 먹는 것처럼 완벽한 음식을 만들면 신선도가 떨어질 수 있다. 식탁에 오르기 직전 단계까지만 준비한다. 샐러드의 경우 야채와 소스를 따로 담아와 먹기 전에 섞는다. <br><br>
<font color="#0066CC">3. 익히는 음식은 완전히 익힌다.</font><br><br>계란말이는 물을 약간 넣어 묽게해서 완전히 익힌다. 튀김요리는 두 번 튀기는게 좋다. 속살까지 튀겨지면서 습기도 적어져 보존기간이 훨씬 길어진다. <br><br>
<font color="#0066CC">4. 식초,소금,술 등을 이용</font> <br><br>밥은 흰 쌀밥보다 먹기 편한 초밥이나 주먹밥을 준비한다. 반찬도 식초 절임을 한 것이 소화도 잘되고 덜 상한다. 반찬류는 평소보다 간을 약간 짜게하는게 기본. <br><br>
<font color="#0066CC">5. 모든 음식은 담는다.</font><br><br>뜨거울 때 뚜껑을 덮으면 뚜껑 안쪽에 맺힌 이슬이 도시락 맛을 떨어뜨리고 음식을 상하게 한다. 특히 튀김요리는 식혀 담지 않으면 뜨거운 김과 수분으로 튀김옷이 눅눅해져 버린다. <br><br>
<font color="#0066CC">6. 반찬은 구분해서 담는다.</font><br><br>여러 가지 반찬을 한꺼번에 한 용기에 담으면 맛이 섞이고 변질하기도 쉽다. 국물이 없는 절임이나 생선구이는 상추 등을 이용하면 보기도 좋다. 토마토의 속을 파내고 반찬을 담아도 훌륭하다. <br><br>
<font color="#0066CC">7. 용기안은 빈곳을 없앤다.</font><br><br>도시락은 운반 중에 내용물이 한쪽으로 쏠리기 쉽다. 담을 때 틈새가 생기지 않게 꼭꼭 채워 넣어야 한다. 공간이 남을 경우엔 오이나 체리토마토를 적당히 곁들인다. <br><br>
<font color="#0066CC">8. 랩으로 튜브를 만든다.</font><br><br>고추장, 드레싱 등을 따로 담아야 할 때는 랩에 꽁꽁 싸서 이쑤시개와 함께 넣는다. 먹기 직전에 이쑤시개로 랩에 구멍을 내고 필요한 곳에 짜서 먹으면 간편하고 깔끔하다. <br>
<font color="#0066CC"><br>9. 냉동시킨 음료수를 활용하자.</font><br><br>냉동시킨 음료수를 활용<br>도시락과 함께 두면 냉동효과를 볼 수 있고 얼었던 것이 녹으면 자연스레 차가운 물이 해결된다. 단 음료 용기는 겉을 수건으로 싸 물기가 흘러내리지 않게 한다. <br><br>
<font color="#0066CC">10. 물수건등 위생소품 준비</font><br><br>물수건은 필수. 물수건을 레몬조각과 함께 넣어서 싸면 향기도 좋고 위생적이다. 식사 전에 수저나 그릇뿐 아니라 손도 닦을 수 있다.
</td>
</tr>
</table>
</body>
</html>

==============================================
[설명]

● imageSource = "http://my.dreamwiz.com/zinah/images/tagbox_banner2.gif" ← 이 곳에 이미지로 쓰일 이미지 주소를 써 주세요.
● imageWidth = 52 imageHeight = 46 ← 이미지의 가로 세로 크기를 적어 주세요.
● imageAlign = "bottomright" //topright, topleft, bottomright, bottomleft  imageAlign = "bottomright" (우측하단)로 되어 있어서 이미지가 우측하단에 나타나는 것입니다. 만일 이 변수의 값을 topright(우측상단), topleft(좌측상단), bottomleft(좌측하단)으로 바꿔가며 테스트 해보면 원하는 위치에 스크롤바를 따라다니는 배너 광고를 만들 수 있습니다.

● linkTo = "http://my.dreamwzi.com/zinah" ← 이곳에 이미지를 클릭하면 연결될 주소를 써주세요.

위로