먼저 HTML 편집에서

사이드바에 DIV 태크를 넣어놓고 자바스크립트를 사용하여 동적으로 위젯을 삽입한다.

div 태그를 사이드바에 삽입
<s_sidebar_element>
  <div id="widjetBox"></div>
</s_sidebar_element>

자바스크립트코드삽입
<script>
Global = {};
Global.shscript =
{
   init : function()
   {
      this.blogDesc = document.getElementById("blogDesc");
      
      doRainbow(this.blogDesc);
      this.widjetBox = document.getElementById("widjetBox");
      this.widjetBox.innerHTML = '' +
        '<ul id="blogxUl">'+
        '<li><a href="http://cafe.naver.com/webprogrammer2/" target="_blank">WebProgrammer 2.0</a></li>'+
        '<li><a href="#">위젯 실습 중입니다.</a></li>'+
        '</ul>';
        this.widjetBox.style.height="50px";
        this.widjetBox.style.border="2px dotted black";
        this.widjetBox.style.marginBottom="5px";
        this.widjetBox.style.overflow="hidden";
        this.widjetBox.style.position="relative";
        
        this.ulTag =document.getElementById("blogxUl");
                this.ulTag.style.width='200px';
          this.ulTag.style.position="absolute";
          this.ulTag.style.top='0px';
                this.ulTag.style.left='0px';
          this.timer = {};
          
          this.widjetBox.onmouseover = this.stopAnimation;        
          
          this.widjetBox.onmouseout = this.animation;
           
        
        window.scrolldir = true;
        

    },
    
    animation : function()
    {
        ulTag = document.getElementById("blogxUl");
        this.timer = setInterval(function()
        {
                scrolldir = false;
                this.ulTag.style.left = (parseInt(this.ulTag.style.left) + 1) + "px";
                if((parseInt(this.ulTag.style.left)) == 200)
                {
                                        this.ulTag.style.left = -100 + "px";
                }

        }, 50);
    },
    
    stopAnimation : function()
    {
        clearInterval(this.timer);
    }



}


function MM_showHideLayers( optionid, visible ) { //v6.0
    var layer = document.getElementById(optionid);
    if(visible == 'show')
        layer.style.visibility = 'visible';
    else if(visible == 'hide')
        layer.style.visibility = 'hidden';
}

</script>

마지막으로 html 코드의 끝에서

<script>
   Global.park.init();
   Global.park.animation();
</script>
Posted by 행복한 프로그래머 궁금쟁이박

댓글을 달아 주세요

  1. BlogIcon Ugg Boots Sale UK 2012.12.11 15:29  댓글주소  수정/삭제  댓글쓰기

    어떤 알려진 것은 그들이부터 호주가 착용 한 것입니다