무플 무서워요
유익하셨나요? 아래의 RSS로 구독 하세요! 가젯으로 구독하시려면 클릭!
올블로그추천버튼 블로그코리아 구독버튼 블로그뉴스 구독버튼 믹시 구독버튼 한RSS 구독버튼 구글리더기 구독버튼 올포스트 구독버튼
인트로 화면 같은 곳에다 써도 좋을 멋진 스크립트에요^^

* 덧붙임
여기다가 바로 적용시켰더니, 마우스 효과가 나타나는 부분은 그림이 위로 올라오기 때문에
아래에 깔린 링크가 클릭이 안 되는 문제점이 있어서, 정말 인트로 화면에나 써야겠네요.
부득이하게 미리보기를 지원 못하고 화면만 캡쳐했습니다.
미리보기를 원하시면 소스를 열어서 복사하신 후, 오른쪽 포스트 검색창에서 '태그연습장'을
검색하셔서 미리 적용해보세요^^

<적용예제화면>
사용자 삽입 이미지


<html>
<head>
<style type="text/css">
    #screen {
        position:absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        overflow: hidden;
    }
    #screen img {
        position: absolute;
        filter: alpha(opacity=50);
        opacity: 0.5;
        left: -1000px;
    }
</style>
<script type="text/javascript">
var xm = 0;
var ym = 0;
var nx = 0;
var ny = 0;
var nw = 0;
var nh = 0;
function resize() {
    with(document.getElementById("screen")){
        nx = offsetLeft;
        ny = offsetTop;
        nw = offsetWidth;
        nh = offsetHeight;
    }
}
onresize = resize;
document.onmousemove = function(e){
    if(window.event) e=window.event;
    xm = (e.x || e.clientX) - nx;
    ym = (e.y || e.clientY) - ny;
    R = 1;
}
// ---------------------
var Nb = 17;
var R = 0;
var C = 0;
var object = new Array();
function makedoot(N){
    this.ds = document.createElement("img");
    this.ds.src = document.getElementById("glob").src;
    document.getElementById("screen").appendChild(this.ds);
    this.r = (N * 100 / Nb);
    this.x = -1000;
    this.y = 0;
    this.Ge = function (){
        with (this){
            if (r >= 100){
                R--;
                if (R<0){
                    x = Math.random() * nw;
                    y = Math.random() * nh;
                }
                else {
                    x = xm;
                    y = ym;
                }
                r = 0;
                ds.style.zIndex = C++;
            }
            r += 2;
            with (ds.style){
                left = Math.round(x-r)+"px";
                top = Math.round(y-r)+"px";
                width = height = Math.round(r * 2)+"px";
            }
            if (ds.filters != undefined) ds.filters.item(0).opacity = Math.round(102 - r);
            else ds.style.opacity = (102 - r) / 100;
        }
    }
}
onload = function() {
    resize();
    for (i=0; i<Nb; i++) object[i] = new makedoot(i);
    setInterval("for(i in object)object[i].Ge();", 16);
}
</script>
</head>
<body>
<div id="screen"></div>
<img id="glob" src="http://psicopompus.tistory.com/attachment/hk030000000011.gif" style="visibility: hidden">
</body>
</html>

이 블로그의 공식 주소는 http://theHermes.kr 입니다.