java script

[버튼시리즈] 폼버튼으로 멋진 텍스트 배너를 만들어 보자

디자인인스 2011. 1. 7. 11:59
// [1단계] <BODY> 태그안에 있는 코드를 복사 해 넣으세요

<body onLoad="StartHeadliner()">

//- [2단계] 아래의 코드를 <BODY> 태그와 </BODY> 태그안에 붙여 넣으세요 ---->

<script language="JavaScript">
<!--
typeWriterWait=120                // TypeWriter 효과 지연속도
blinkTextWait=1000           // Blink 효과 지연시간
blinkSpacesWait=300         // Blink 공백 지연시간
blinkMax=3                         // Blink 횟수
expandWait=100                  // Expand 효과의 지연시간
scrollWait=90                // 스크롤 효과의 지연시간
scrollWidth=34                 // 스크롤 글자수
randomLines=false                // 랜덤하게 메세지를 보여줄지 여부 (true/false)
lineMax=8                        // 전체 메세지 라인수
lines=new Array(lineMax)

// (메세지, 링크, 타겟, 효과, 지연시간) 의 형식으로 메세지들을 설정 하세요
// 사용할 수 있는 효과는 Blink, Scroll, Static, Expand, TypeWriter 등이 있습니다

lines[1]=new Line("자바스크립트 소스", "http://www.jasko.co.kr", "", Blink, 500)
lines[2]=new Line("웹메일 커뮤니케이션", "http://www.daum.net", "_search", Scroll, 1000)
lines[3]=new Line("야후! 코리아", "http://www.yahoo.co.kr", "", Static, 3500)
lines[4]=new Line("네이버 웹서치", "http://www.naver.com", "", Expand, 2000)
lines[5]=new Line("폼버튼에 스타일을 사용하면 재밋습니다", "", "", Scroll, 3000)
lines[6]=new Line("버튼처럼 보이지 않죠?", "","", TypeWriter, 1500)
lines[7]=new Line("스크립트 코드의 맨 마지막에서 2번째 라인을 보세요", "", "", TypeWriter, 2500)
lines[8]=new Line("폼 버튼에 스타일을 추가하였습니다", "", "", Static, 3500)

// 여기서부터는 가급적 수정하지 마세요

lineText=""
timerID=null
timerRunning=false
spaces=""
charNo=0
charMax=0
charMiddle=0
lineNo=0
lineWait=0

function Line(text, url, frame, type, wait) {
        this.text=text
        this.url=url
        this.frame=frame
        this.Display=type
        this.wait=wait
}

function StringFill(c, n) {
        var s=""
        while (--n >= 0) {
        s+=c
        }
        return s
}

function getNewRandomInteger(oldnumber, max) {
        var n=Math.floor(Math.random() * (max - 1) + 1)
        if (n >= oldnumber) {
        n++
        }
        return n
}

function getRandomInteger(max) {
        var n=Math.floor(Math.random() * max + 1)
        return n
}
function GotoUrl(url, frame) {
        if (frame != '') {
        if (frame == 'self') self.location.href=url
        else if (frame == 'parent') parent.location.href=url
        else if (frame == 'top') top.location.href=url
        else {
        s=eval(top.frames[frame])
        if (s != null) top.eval(frame).location.href=url
        else window.open(url, frame, "toolbar=yes,status=yes,scrollbars=yes")
                  }
           }
        else window.location.href=url
}
function Static() {
        document.formDisplay.buttonFace.value=this.text
        timerID=setTimeout("ShowNextLine()", this.wait)
}
function TypeWriter() {
        lineText=this.text
        lineWait=this.wait
        charMax=lineText.length
        spaces=StringFill(" ", charMax)
        TextTypeWriter()
}
function TextTypeWriter() {
        if (charNo <= charMax) {
        document.formDisplay.buttonFace.value=lineText.substring(0, charNo)+spaces.substring(0, charMax-charNo)
        charNo++
        timerID=setTimeout("TextTypeWriter()", typeWriterWait)
        }
        else {
        charNo=0
        timerID=setTimeout("ShowNextLine()", lineWait)
           }
}
function Blink() {
        lineText=this.text
        charMax=lineText.length
        spaces=StringFill(" ", charMax)
        lineWait=this.wait
        TextBlink()
}
function TextBlink() {
        if (charNo <= blinkMax * 2) {
                if ((charNo % 2) == 1) {
                        document.formDisplay.buttonFace.value=lineText
                        blinkWait=blinkTextWait
                }
                else {
                        document.formDisplay.buttonFace.value=spaces
                        blinkWait=blinkSpacesWait
                }
                charNo++
                timerID=setTimeout("TextBlink()", blinkWait)
        }
        else {
        charNo=0
        timerID=setTimeout("ShowNextLine()", lineWait)
           }
}
function Expand() {
        lineText=this.text
        charMax=lineText.length
        charMiddle=Math.round(charMax / 2)
        lineWait=this.wait
        TextExpand()
}
function TextExpand() {
        if (charNo <= charMiddle) {
                document.formDisplay.buttonFace.value=lineText.substring(charMiddle - charNo, charMiddle + charNo)
                charNo++
                timerID=setTimeout("TextExpand()", expandWait)
        }
        else {
        charNo=0
        timerID=setTimeout("ShowNextLine()", lineWait)
           }
}
function Scroll() {
        spaces=StringFill(" ", scrollWidth)
        lineText=spaces+this.text
        charMax=lineText.length
        lineText+=spaces
        lineWait=this.wait
        TextScroll()
}
function TextScroll() {
        if (charNo <= charMax) {
                document.formDisplay.buttonFace.value=lineText.substring(charNo, scrollWidth+charNo)
                charNo++
                timerID=setTimeout("TextScroll()", scrollWait)
        }
        else {
        charNo=0
        timerID=setTimeout("ShowNextLine()", lineWait)
           }
}
function StartHeadliner() {
        StopHeadliner()
        timerID=setTimeout("ShowNextLine()", 2000)
        timerRunning=true
}
function StopHeadliner() {
        if (timerRunning) {
        clearTimeout(timerID)
        timerRunning=false
           }
}
function ShowNextLine() {
        if (randomLines) lineNo=getNewRandomInteger(lineNo, lineMax)
        else (lineNo < lineMax) ? lineNo++ : lineNo=1
        lines[lineNo].Display()
}
function LineClick(lineNo) {
        document.formDisplay.buttonFace.blur()
        if (lineNo > 0) GotoUrl(lines[lineNo].url, lines[lineNo].frame)
}
with (document) {
write('<center><form name="formDisplay"><input type="button"')
write('name="buttonFace" value="자바스크립트 소스 라이브러리"')
write('onClick="LineClick(lineNo)" style="height:30;font-size:20;font-weight:bold;color:white;border:none;background-color:#FFCC00"></input></form></center>')
}
// -->
</script>
<!---->

 

저작자표시 비영리 변경금지 (새창열림)

'java script' 카테고리의 다른 글

자바스크립트 풀다운 메뉴 만들기  (0) 2011.01.07
[버튼시리즈] 누를때마다 다른 메세지를 보여줍니다  (0) 2011.01.07
[버튼시리즈] 앞으로가기, 뒤로가기  (0) 2011.01.07
이메일로 사과받기 ^^  (0) 2011.01.07
[버튼시리즈] 경고메세지 보여주기  (0) 2011.01.07

'java script'의 다른글

  • 현재글[버튼시리즈] 폼버튼으로 멋진 텍스트 배너를 만들어 보자

관련글

티스토리툴바