<html>
<head>
<title></title>
<style type="text/css">
    #center {
        position: absolute;
    }
    #slider {
        position: absolute;
        width: 600px;  /*메뉴 가로크기*/
        height: 300px; /*메뉴 세로크기*/
        left: 0px;
        top: 0px;
        overflow: hidden;
    }
    #slider .slide {
        position: absolute;
        top: 0px;
        height: 300px;
        width: 400px;
        background: #000;
        overflow: hidden;
        border-left: #000 solid 1px;
        cursor: default;
    }
    #slider .title   { /*서브메뉴제목*/
        color: #FFF;
        font-weight: bold;
        font-size: 13px;
        font-family:verdana;
        letter-spacing:-1px;

    }
    #slider .backgroundText {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 100%;
        background: #000;
        filter: alpha(opacity=40);
        opacity: 0.4;
    }
    #slider .text {
        position: absolute;
        top: 1%;
        top: 100%;
        color: #FFF;
        font-family: verdana;
        font-size: 11px;
        width: 250px;
        left: 10px;
    }
    #slider .diapo {
        position: absolute;
        filter: alpha(opacity=100);
        opacity: 1;
        visibility: hidden;
    }
</style>

<script type="text/javascript">
/* ==== slider nameSpace ==== */
var slider = function() {
    /* ==== private methods ==== */
    function getElementsByClass(object, tag, className) {
        var o = object.getElementsByTagName(tag);
        for ( var i = 0, n = o.length, ret = []; i < n; i++) {
            if (o[i].className == className) ret.push(o[i]);
        }
        if (ret.length == 1) ret = ret[0];
        return ret;
    }
    function setOpacity (obj,o) {
        if (obj.filters) obj.filters.alpha.opacity = Math.round(o);
        else obj.style.opacity = o / 100;
    }
    /* ==== Slider Constructor ==== */
    function Slider(oCont, speed, iW, iH, oP) {
        this.slides = [];
        this.over   = false;
        this.S      = this.S0 = speed;
        this.iW     = iW;
        this.iH     = iH;
        this.oP     = oP;
        this.oc     = document.getElementById(oCont);
        this.frm    = getElementsByClass(this.oc, 'div', 'slide');
        this.NF     = this.frm.length;
        this.resize();
        for (var i = 0; i < this.NF; i++) {
            this.slides[i] = new Slide(this, i);
        }
        this.oc.parent = this;
        this.view      = this.slides[0];
        this.Z         = this.mx;
        /* ==== on mouse out event ==== */
        this.oc.onmouseout = function () {
            this.parent.mouseout();
            return false;
        }
    }
    Slider.prototype = {
        /* ==== animation loop ==== */
        run : function () {
            this.Z += this.over ? (this.mn - this.Z) * .5 : (this.mx - this.Z) * .5;
            this.view.calc();
            var i = this.NF;
            while (i--) this.slides[i].move();
        },
        /* ==== resize  ==== */
        resize : function () {
            this.wh = this.oc.clientWidth;
            this.ht = this.oc.clientHeight;
            this.wr = this.wh * this.iW;
            this.r  = this.ht / this.wr;
            this.mx = this.wh / this.NF;
            this.mn = (this.wh * (1 - this.iW)) / (this.NF - 1);
        },
        /* ==== rest  ==== */
        mouseout : function () {
            this.over      = false;
            setOpacity(this.view.img, this.oP);
        }
    }
    /* ==== Slide Constructor ==== */
    Slide = function (parent, N) {
        this.parent = parent;
        this.N      = N;
        this.x0     = this.x1 = N * parent.mx;
        this.v      = 0;
        this.loaded = false;
        this.cpt    = 0;
        this.start  = new Date();
        this.obj    = parent.frm[N];
        this.txt    = getElementsByClass(this.obj, 'div', 'text');
        this.img    = getElementsByClass(this.obj, 'img', 'diapo');
        this.bkg    = document.createElement('div');
        this.bkg.className = 'backgroundText';
        this.obj.insertBefore(this.bkg, this.txt);
        if (N == 0) this.obj.style.borderLeft = 'none';
        this.obj.style.left = Math.floor(this.x0) + 'px';
        setOpacity(this.img, parent.oP);
        /* ==== mouse events ==== */
        this.obj.parent = this;
        this.obj.onmouseover = function() {
            this.parent.over();
            return false;
        }
    }
    Slide.prototype = {
        /* ==== target positions ==== */
        calc : function() {
            var that = this.parent;
            // left slides
            for (var i = 0; i <= this.N; i++) {
                that.slides[i].x1 = i * that.Z;
            }
            // right slides
            for (var i = this.N + 1; i < that.NF; i++) {
                that.slides[i].x1 = that.wh - (that.NF - i) * that.Z;
            }
        },
        /* ==== HTML animation : move slides ==== */
        move : function() {
            var that = this.parent;
            var s = (this.x1 - this.x0) / that.S;
            /* ==== lateral slide ==== */
            if (this.N && Math.abs(s) > .5) {
                this.obj.style.left = Math.floor(this.x0 += s) + 'px';
            }
            /* ==== vertical text ==== */
            var v = (this.N < that.NF - 1) ? that.slides[this.N + 1].x0 - this.x0 : that.wh - this.x0;
            if (Math.abs(v - this.v) > .5) {
                this.bkg.style.top = this.txt.style.top = Math.floor(2 + that.ht - (v - that.Z) * that.iH * that.r) + 'px';
                this.v = v;
                this.cpt++;
            } else {
                if (!this.pro) {
                    /* ==== adjust speed ==== */
                    this.pro = true;
                    var tps = new Date() - this.start;
                    if(this.cpt > 1) {
                        that.S = Math.max(2, (28 / (tps / this.cpt)) * that.S0);
                    }
                }
            }
            if (!this.loaded) {
                if (this.img.complete) {
                    this.img.style.visibility = 'visible';
                    this.loaded = true;
                }
            }
        },
        /* ==== light ==== */
        over : function () {
            this.parent.resize();
            this.parent.over = true;
            setOpacity(this.parent.view.img, this.parent.oP);
            this.parent.view = this;
            this.start = new Date();
            this.cpt = 0;
            this.pro = false;
            this.calc();
            setOpacity(this.img, 100);
        }
    }
    /* ==== public method - script initialization ==== */
    return {
        init : function() {
            // create instances of sliders here
            // parameters : HTMLcontainer name, speed (2 fast - 20 slow), Horizontal ratio, vertical text ratio, opacity
            this.s1 = new Slider("slider", 12, 1.84/3, 1/3.2, 70);
            setInterval("slider.s1.run();", 16);
        }
    }
}();

</script>
</head>

<body onload="slider.init();">
<div id="center">
    <div id="slider">
        <div class="slide">
            <img class="diapo" src="http://www.blueb.co.kr/SRC/javascript/image8/m001.gif" alt="">
            <div class="text">
                  <span class="title">SUB MENU 1</span><br>
                    | smenu 1 | smenu2 | smenu3 | smenu4 |
            </div>
        </div>
        <div class="slide">
            <img class="diapo" src="http://www.blueb.co.kr/SRC/javascript/image8/m002.gif" alt="">
            <div class="text">
                  <span class="title">SUB MENU 2</span><br>
                    | smenu 1 | smenu2 | smenu3 | smenu4 |
            </div>
        </div>
        <div class="slide">
            <img class="diapo" src="http://www.blueb.co.kr/SRC/javascript/image8/m003.gif" alt="">
            <div class="text">
                  <span class="title">SUB MENU 3</span><br>
                    | smenu 1 | smenu2 | smenu3 | smenu4 |
            </div>
        </div>
        <div class="slide">
            <img class="diapo" src="http://www.blueb.co.kr/SRC/javascript/image8/m004.gif" alt="">
            <div class="text">
                  <span class="title">SUB MENU 4</span><br>
                    | smenu 1 | smenu2 | smenu3 | smenu4 |
            </div>
        </div>
        <div class="slide">
            <img class="diapo" src="http://www.blueb.co.kr/SRC/javascript/image8/m005.gif" alt="">
            <div class="text">
                  <span class="title">SUB MENU 5</span><br>
                    | smenu 1 | smenu2 | smenu3 | smenu4 |

            </div>
        </div>
        <div class="slide">
            <img class="diapo" src="http://www.blueb.co.kr/SRC/javascript/image8/m006.gif" alt="">
            <div class="text">
                  <span class="title">SUB MENU 6</span><br>
                    | smenu 1 | smenu2 | smenu3 | smenu4 |
            </div>
        </div>
        <div class="slide">
            <img class="diapo" src="http://www.blueb.co.kr/SRC/javascript/image8/m007.gif" alt="">
            <div class="text">
                  <span class="title">SUB MENU 7</span><br>
                    | smenu 1 | smenu2 | smenu3 | smenu4 |
            </div>
        </div>
        <div class="slide">
            <img class="diapo" src="http://www.blueb.co.kr/SRC/javascript/image8/m008.gif" alt="">
            <div class="text">
                  <span class="title">SUB MENU 8</span><br>
                    | smenu 1 | smenu2 | smenu3 | smenu4 |
            </div>
        </div>
        <div class="slide">
            <img class="diapo" src="http://www.blueb.co.kr/SRC/javascript/image8/m009.gif" alt="">
            <div class="text">
                  <span class="title">SUB MENU 9</span><br>
                    | smenu 1 | smenu2 | smenu3 | smenu4 |
            </div>
        </div>

    
    </div>
</div>


<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
</body>
</html>

 

저작자표시 비영리 변경금지

<style>
<!--
       #postit{position:absolute;width:250;padding:5px;background-color:lightyellow;border:1px solid black;visibility:hidden;z-index:100;cursor:hand;}
-->
</style>

 


<body>

<div id="postit" style="left:150px;top:150px">
<div align="right"><b><a href="javascript:closeit()">[닫기]</a></b></div>

<b>포스트잇 스크립트</b><br>
<p>페이지를 열면 작은 공지창 처럼 뜨는 포스트잇 스크립트 입니다<br>
마우스로 원하는 위치에 끌어 놓을 수 있답니다</p>
<p>이 공지창은 브라우저를 열때마다 뜨게 할 수도 있고, 한번만 열리게 할 수도 있습니다</p>
</div>

<script>
var once_per_browser=0; //0은 브라우저 실행시마다 1은 딱 한번만

var ns4=document.layers
var ie4=document.all
var ns6=document.getElementById&&!document.all

if (ns4)
       crossobj=document.layers.postit;
else if (ie4||ns6)
       crossobj=ns6? document.getElementById("postit") : document.all.postit;

function closeit(){
       if (ie4||ns6)
               crossobj.style.visibility="hidden";
       else if (ns4)
               crossobj.visibility="hide";
}

function get_cookie(Name) {
       var search = Name + "=";
       var returnvalue = "";

       if (document.cookie.length > 0) {
               offset = document.cookie.indexOf(search);

               if (offset != -1) {  
                       offset += search.length;
                       end = document.cookie.indexOf(";", offset);

                       if (end == -1)
                               end = document.cookie.length;

                       returnvalue=unescape(document.cookie.substring(offset, end));
               }
       }

       return returnvalue;
}

function showornot(){
       if (get_cookie('postdisplay')==''){
               showit();
               document.cookie="postdisplay=yes";
       }
}

function showit(){
       if (ie4||ns6)
               crossobj.style.visibility="visible";
       else if (ns4)
               crossobj.visibility="show";
}

if (once_per_browser)
       showornot();
else
       showit();

</script>


<script language="JavaScript1.2">

function drag_drop(e){
       if (ie4&&dragapproved){
               crossobj.style.left=tempx+event.clientX-offsetx;
               crossobj.style.top=tempy+event.clientY-offsety;
               return false;
       }
       else if (ns6&&dragapproved){
               crossobj.style.left=tempx+e.clientX-offsetx;
               crossobj.style.top=tempy+e.clientY-offsety;
               return false;
       }
}

function initializedrag(e){
       if (ie4&&event.srcElement.id=="postit"||ns6&&e.target.id=="postit"){
               offsetx=ie4? event.clientX : e.clientX;
               offsety=ie4? event.clientY : e.clientY;

               tempx=parseInt(crossobj.style.left);
               tempy=parseInt(crossobj.style.top);

               dragapproved=true;
               document.onmousemove=drag_drop;
       }
}

document.onmousedown=initializedrag;
document.onmouseup=new Function("dragapproved=false");

</script>
</body>
</html>

 

저작자표시 비영리 변경금지

문서 크기에 맞게 아이프레임 자동 조절

<head> </head> 안에 넣어주세요

<script>
   function initsize() {
                               self.resizeTo(document.body.scrollWidth, document.body.scrollHeight);
                             }
</script>

<body> 사이에 넣어주세요

<body bgcolor="#FFFFFF" onLoad="initsize();">

저작자표시 비영리 변경금지

<a onfocus="blur()" href="#"

                  OnMouseOut="na_restore_img_src('qt1[구분명]', 'document')" 

                  OnMouseOver="na_change_img_src('qt1', 'document', '[2차 마우스가 올라간 후 나올 이미지 경로]', true)"><img src="[1차 페이지 처음 표시 이미지 경로]" border="0" name="qt1[구분명]"></a>

저작자표시 비영리 변경금지
로그인 ID부분에 커서 자동으로 가게하기

<body>부분에 아래 코드를 삽입한다.
onload="폼이름.텍스트박스이름.focus();"

폼이름과 텍스트박스이름을 넣는다.
제로보드스킨을 이용한 로그인인 경우, 로그인 스킨에 가면 확인할 수 있다.

예)
<form name=zb_login method=post action="[action]" onsubmit="return zb_login_check_submit();">

- zb_login(폼이름)

<input type="text" name="user_id" maxlength="18" size="12" style="font-family:Tahoma; font-weight:bold; font-size:9pt; color:white; background-color:rgb(153,0,0); border-width:1; text-align:right; border-color:rgb(153,0,0); border-style:none;">

- user_id(텍스트박스이름)

그렇다면... onload="zb_login.user_id.focus();"이라고 입력하고 저장한다.

결론적으로 아래와 같이 입력한다.
<body  leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" onload="zb_login.user_id.focus();">

 

저작자표시 비영리 변경금지

<a onfocus="blur()" href="#">내용</a>

저작자표시 비영리 변경금지
헤드 부분에 삽입할 코드
<script language="JavaScript" type="text/javascript" src="경로/swf.js"></script>

.js파일 코드<첨부파일에 파일 있음>

document.oncontextmenu=new Function("return false");
document.ondragstart=new Function("return false");
document.onselectstart=new Function("return false");

mousescript_off.js

저작자표시

플래쉬 재생시 붙여야 하는 코드를 .js파일로 만들어 재생 경로만 추가해서 사용하면 되는 간단한 파일입니다.

헤드 부분에 삽입할 코드
<script language="JavaScript" type="text/javascript" src="경로/swf.js"></script>

플래쉬 삽입할 부분에 코드
<script>view_swf("플래쉬경로", 가로 사이즈, 세로 사이즈);</script>


.js파일 코드<첨부파일에 파일 있음>

/-------------------------------------------------------------------------------/

n alert_test(){
   alert('스크립트 삽입 확인');
}


//플래쉬 처리를 위한 간단한 임베디드 코드
function view_swf(url, wid, hei){
   document.write('<object
                    classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
                    codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0"
                    width="'+wid+'"
                    height="'+hei+'" VIEWASTEXT>');
   document.write('<param name="movie" value="'+url+'">');
   document.write('<param name="quality" value="high">');
   //wmode 에는 window(객체 최상위), opaque(객체 최하위), transparent(객체 투명화)가 있다.
   //필요시 옵션으로 선택하도록 변경가능.
   document.write('<param name="wmode" value="window">');
   document.write('</object>');
}

/-------------------------------------------------------------------------------/

swf.js

저작자표시

+ Recent posts

티스토리툴바