본문 바로가기

javascript

광고텍스트가 블라인드가 열리면서 바뀌는 듯한 효과

<style>
A {
        text-decoration:none;
}
.s {
        position:absolute;
    left:-5000px;
        topt:-5000px;
}
</style>

</HEAD>

<BODY BGCOLOR="#FFFFFF">

<!-- This Script Modified by Java Depot -->
<!-- Web Site : http://www.javascript.co.kr -->
<script>
<!-- Beginning of JavaScript -

// CREDITS:
// Flip-Color-Scroller with unique transition effect
// by Urs Dudli and Peter Gehrig
// Copyright (c) 2000 Peter Gehrig and Urs Dudli. All rights reserved.
// Permission given to use the script provided that this notice remains as is.
// Additional scripts can be found at http://www.24fun.com/fast/index.html
// info@24fun.com
// 11/9/2000

// IMPORTANT:
// If you add this script to a script-library or script-archive
// you have to add a link to http://www.24fun.com/fast/index.html on the webpage
// where this script will be running.

// CONFIGURATION:
// Go to http://www.24fun.com/fast/index.html and download the script as ZIP-file
// with step by step instructions and copy-and-paste installation.

// your messages. Add as many messages a you like.
var message = new Array()
message[0]="GET A FREE WEB POLL NOW"
message[1]="FIND LOVE & REALTIONSHIPS"
message[2]="DISCOVER ALTERNATIVE MEDICINE"
message[3]="AND BE HAPPY DO NOT WORRY"

// links for your messages. You need as many links as as messages.
// If you don't want to link a message write '#' instead of an URL (see last sample)
var messageurl = new Array()
messageurl[0]="http://www.commission-junction.com/track/track.dll?AID=900029&PID=503463&URL=http%3A%2F%2Fwww%2Epollit%2Ecom%2F%3Fref%3Dcj%5Ftext1"
messageurl[1]="http://service.bfast.com/bfast/click?bfmid=20810152&siteid=30125010&bfpage=health3"
messageurl[2]="http://service.bfast.com/bfast/click?bfmid=20810152&siteid=30125010&bfpage=health2"
messageurl[3]="#"

// target of the message-links (HTML conventions)
var target_url="_blank"
        
// width of scroller
var textwidth=240

// height of scroller
var textheight=100

// borderwidth of scroller
var borderwidth=2

// size of the font (HTML conventions)
var font_size=5

// font
var font_face="Verdana"

// horizontal position of the scroller (distance to the left margin of the window)
var horizontal_pos=10

// vertical position of the scroller (distance to the top margin of the window)
var vertical_pos=10

// number of lamellas.
var x_slices=12

// colors (required for the color-flip-effect)
var color1="red"
var color2="yellow"

// pause beween the messages (seconds)
var pause=2

// - End of JavaScript - -->
</script>
<script>
var i_loop=0
var i_message=0
var width_slice=Math.ceil(textwidth/x_slices)
var cliptop=0
var clipbottom=textheight
var i_clipright=1
var content=""
var bg_ticker=new Array(color1,color2)
var font_color=new Array(color2,color1)
var i_color=0
pause=pause*1000

function initiate() {
        getcontent()
    if (document.all) {
            for (i=0;i<=x_slices;i++) {
            var thisinners=eval("s"+i)
            thisinners.innerHTML=content
            var thiss=eval("document.all.s"+i+".style")
            thiss.posLeft=horizontal_pos
            thiss.posTop=vertical_pos
        }
                
                document.all.whole.style.posLeft=horizontal_pos
                document.all.whole.style.posTop=vertical_pos
            i_message++
            openlamellar()
    }
        if (document.layers) {
            for (i=0;i<=x_slices;i++) {
            var thisinners=eval("document.s"+i+".document")
            thisinners.write(content)
                        thisinners.close()
            var thiss=eval("document.s"+i)
            thiss.left=horizontal_pos
            thiss.top=vertical_pos
        }
                document.whole.document.write(" ")
                document.whole.document.close()
                document.whole.left=horizontal_pos
                document.whole.top=vertical_pos
            i_message++
            openlamellarNN()
    }
}

function openlamellar() {
        clipleft=-width_slice
        clipright=0
    if (i_clipright<=width_slice) {
        for (i=0;i<=x_slices;i++) {
            var thiss=eval("document.all.s"+i+".style")
            thiss.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"
            clipleft+=width_slice
            clipright=clipleft+i_clipright
                }
    i_clipright++
    var timer=setTimeout("openlamellar()",20)
           }
           else {
                clearTimeout(timer)
                whole.innerHTML=content
                var timer=setTimeout("changemessage()",pause)
        }
}

function openlamellarNN() {
        clipleft=-width_slice
        clipright=0
    if (i_clipright<=width_slice) {
        for (i=0;i<=x_slices;i++) {
            var thiss=eval("document.s"+i)
                        thiss.clip.left=clipleft
                thiss.clip.right=clipright
                thiss.clip.top=cliptop
                thiss.clip.bottom=clipbottom
            clipleft+=width_slice
            clipright=clipleft+i_clipright
                }
    i_clipright++
    var timer=setTimeout("openlamellarNN()",20)
   }
           else {
                clearTimeout(timer)
                document.whole.document.write(content)
                document.whole.document.close()
                var timer=setTimeout("changemessageNN()",2000)
        }
}


function getcontent() {
    content="<table border="+borderwidth+" cellpadding='3' width="+textwidth+" height="+textheight+">"
    content+="<tr><td bgcolor="+bg_ticker[i_color]+" align='center'>"
    content+="<a href="+messageurl[i_message]+" target="+target_url+">"
    content+="<font face="+font_face+" size="+font_size+" color="+font_color[i_color]+">"
    content+=message[i_message]
    content+="</font></a></td></tr></table>"
}

function changemessage() {
        i_color++
        if (i_color>1) {i_color=0}
        i_clipright=0
        clipleft=0
        clipright=0
        for (i=0;i<=x_slices;i++) {
               var thiss=eval("document.all.s"+i+".style")
            thiss.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"
        }
        if (i_message>message.length-1) {i_message=0}
        getcontent()

        for (i=0;i<=x_slices;i++) {
        var thisinners=eval("s"+i)
        thisinners.innerHTML=content  
    }
        i_message++
        openlamellar()
}

function changemessageNN() {
        i_color++
        if (i_color>1) {i_color=0}
        i_clipright=0
        clipleft=0
        clipright=0
        for (i=0;i<=x_slices;i++) {
            var thiss=eval("document.s"+i)
                        thiss.clip.left=clipleft
                thiss.clip.right=clipright
                thiss.clip.top=cliptop
                thiss.clip.bottom=clipbottom
            clipleft+=width_slice
            clipright=clipleft+i_clipright
        }
        if (i_message>message.length-1) {i_message=0}
        getcontent()
        for (i=0;i<=x_slices;i++) {
        var thisinners=eval("document.s"+i+".document")
        thisinners.write(content)
                thisinners.close()
    }
        i_message++
        openlamellarNN()
}

document.write("<span id='whole' class='s'></span>")
for (i=0;i<=x_slices;i++) {
        document.write("<span id='s"+i+"' class='s'></span>")
}
document.close()
window.onload=initiate
</script>

<p><center>
<font face="굴림, 굴림체" size="2">쉬운 자바 베껴쓰는 자바<br>
by <a href="http://www.javascript.co.kr">Java Depot</a></font>
</center><p>