태그 자료실

회원로그인

무료회원가입 보안로그인

아이디/비밀번호찾기

깔끔한 이미지 펼침박스

16년 전

<head>
<style type="text/css">

</style>
<script language="javascript">
var UserAgent = navigator.userAgent;
var AppVersion = (((navigator.appVersion.split('; '))[1].split(' '))[1]);

var SListMD = false;
var SListIDX = 0;

var TableCellAttr = " cellpadding=0 cellspacing=0 ";
var ContourStyle = "";
var ContourStyle2 = "border:1 solid #c7c7c7;";
var ScrollBarStyle = "";
var ItemStyle = "text-indent:3px;cursor:hand;height:16px;padding-top:2px;";
var ALTStyle = "'filter:alpha(opacity=80);border:1 solid #f2f2f2'";

var newWin=0;
document.onmousedown = dispList;
SList = new Array();

function setSelectList(pSrc, pBG)
{
    this.IDX = SList.length;
    this.src = pSrc;
    this.bgcolor = pBG;
    this.hideList = true;

    /* SelectList Object */
    this.Table;
    this.Title;
    this.List;
    this.Items;
    this.SelectedItemName;

    this.width;
    this.getWidth = getWidth;

    /* Create SelectList Object Function */
    this.itemObj = createObject;
    this.ListObj = createSListList;
    this.TitleObj = createSListTitle;
    this.TableObj = createSList;

    /* Select List Event Handler */
    this.TitleMouseDown = TitleMouseDownEventHandler;
    this.ListMouseOver = ListMouseOverEventHandler;
    this.ListMouseOut = ListMouseOutEventHandler;
    this.ListMouseDown = ListMouseDownEventHandler;

    this.append = appendSList;
    this.TableObj();

    SList[this.IDX] = this;

    return;
}

function appendSList()
{
    document.write("<div id=TempDiv></div>\n");
    document.all.TempDiv.appendChild(this.Table);
    document.all.TempDiv.removeNode();

    return;
}

/* Select Guide List function
        htmlSrc        : SelectList html source
        bg        : back ground color
*/
function SelectList(htmlSrc, bg, openstat)
{
    if ( UserAgent.indexOf("MSIE") < 0 || AppVersion < 5 ) {
        document.write(htmlSrc);
        return;
    } else {
newWin = openstat;
//        if ( !bg ) bg = "#FEFFCB";
        var SListObj = new setSelectList(htmlSrc, bg);
        SListObj.append();

        return SListObj;
    }
}

function createObject(pSrc)
{
    oObj = new Object();
    oObj.Div = document.createElement("DIV");
    oObj.Div.insertAdjacentHTML("afterBegin", pSrc);
    this.Items = oObj.Div.children(0);

    return this.Items;
}

function createSListList()
{
    var ListItem = "";
    var ListLength = this.Items.length;
    var ListHeight;
    var scrollbarStyle = "";

    for ( i = 0; i < ListLength; i++ ) {
        ListItem += "<DIV id=List idx="+i+" style="+ItemStyle
            +" onMouseDown='SList["+this.IDX+"].ListMouseDown(this);'"
            +" onMouseOver='SList["+this.IDX+"].ListMouseOver(this);'"
            +" onMouseOut='SList["+this.IDX+"].ListMouseOut(this);'>"
            +this.Items[i].innerText+"</DIV>";
    }

    if ( ListLength < 8 ) { scrollbarStyle = "hidden"; }
    else { scrollbarStyle = "scroll"; ListHeight = 128; }

    this.List = createObject(""
        +"<DIV id=bground style='"+ContourStyle2+ScrollBarStyle
        +"z-index:10;background:"+this.bgcolor+";position:absolute;visibility:hidden;color:757575;"
        +"width:"+(this.width+17)+";height:"+ListHeight+";overflow-Y:"+scrollbarStyle+";filter:alpha(opacity=85);'>"
        +ListItem+"</DIV>");

    return;
}

function createSListTitle()
{
    var MaxLength = 0;
    var width;
    var ListLength = this.Items.length;

    for ( i = 0; i < ListLength; i++ ) {
        if (this.Items.options[i].selected) {
            this.SelectedItemName = this.Items.options[i].innerText;
            SelectedItemValue = this.Items.options[i].value;
        }
    }

    this.getWidth();

    TitleItem = createObject(""
        +"<table border=0 "+TableCellAttr+" style='cursor:hand;'><tr bgcolor="+this.bgcolor+">\n"
                +"<td width="+(this.width)+" nowrap></td>"
                +"<td style='display:none;'></td>"
                +"<td width=15 align=center><img src='http://dajuji.cdn1.cafe24.com/img/js5-77-down_arrow.gif' width=15 height=15></td>"
        +"</tr></table>");
    SelectedItemObj = createObject(""
        +"<div style='position:absolute;top:0px;left:3px;color:757575;width:100%;'>"+this.SelectedItemName
        +"</div>");

    TitleItem.cells(0).appendChild(SelectedItemObj);
    TitleItem.cells(1).appendChild(this.Items);

    this.Title = createObject(""
        +"<DIV style='position:relative;top:0px;left:0px;color:757575;"+ContourStyle
        +"' onMouseDown='SList["+this.IDX+"].TitleMouseDown();'>"
        +TitleItem.outerHTML+"</DIV>");

    return;
}

function createSList()
{
    this.itemObj(this.src);
    this.TitleObj();
    this.ListObj();

    this.Table = createObject(""
        +"<table border=0 "+TableCellAttr+">\n"
        +"<tr><td></td></tr>"
        +"</table>");

    this.Table.cells(0).appendChild(this.Title);
    this.Table.cells(0).appendChild(this.List);

    return;
}

function dispList()
{
    var hideList = true;
    if ( event.srcElement.id == "bground") hideList = false;
    if ( !SListMD ) {
        for ( i = 0; i < SList.length; i++ ) {
            SList[i].hideList = true;
        }
    }

    if ( SList.length > 0 ) {
        for ( i = 0; i < SList.length; i++ ) {
            if ( SList[i].hideList && hideList )
                SList[i].List.style.visibility = "hidden";
        }

        SListMD = false;
        SList[SListIDX].Title.children(0).cells(0).childNodes(0).innerText = SList[SListIDX].SelectedItemName;
    }

    return;
}

function TitleMouseDownEventHandler()
{
    if ( this.List.style.visibility == "visible" ) {
        this.List.style.visibility = "hidden";
        this.hideList = true;
    } else {
        this.List.style.visibility = "visible";
        this.hideList = false;
    }

    for ( i = 0; i < SList.length; i++ )
        if ( i != this.IDX ) SList[i].hideList = true;

    SList[SListIDX].Title.children(0).cells(0).childNodes(0).innerText = SList[SListIDX].SelectedItemName;
    SListMD = true;
    SListIDX = this.IDX;

    return;
}

function ListMouseOverEventHandler(f)
{
    f.style.background = "#F5E7DE";
    f.style.color = "000000";
    return;
}

function ListMouseOutEventHandler(f)
{
    f.style.background = this.bgcolor;
    f.style.color = "757575";

    return;
}

function ListMouseDownEventHandler(f)
{
    var TChildren = this.Title.children(0).cells;
    var obj_length = this.Items.length;

    for ( i = 0; i < obj_length; i++ ) {
                        this.Items.options[i].selected = false;
                if ( i == f.idx ) {
            this.Items.options[i].selected = true;
            SI_Name = this.Items.options[i].innerText;
                        }
    }

    if (newWin == 1)
            if(this.Items.options[f.idx].value != ""){
                                location.href = this.Items.options[f.idx].value;
                        }

    if (newWin == 2)
                window.open(this.Items.options[f.idx].value, "_blank");

    this.SelectedItemName = SI_Name;
    TChildren(1).childNodes(0).outerHTML = this.Items.outerHTML;
    this.List.style.visibility = "hidden";
    return;
}

function getWidth()
{
    document.all.sl_Div.innerHTML = this.Items.outerHTML;
    this.width = document.all.sl_Div.scrollWidth - 20;

    return;
}

</script>
<div id="sl_Div" style="border-style:none;position:absolute;left:0px;top:0px;z-index:1;visibility:hidden;color:eeeeee;"></div>
</head>

<body>

<table cellpadding=0 cellspacing=0 width=165 border=0 align="center">
<tr>
<td style="padding-left:10px;"> <table cellpadding=0 cellspacing=1 bgcolor="d4d4d4">
<tr>
<td bgcolor="FFFFFF" style="padding:1px;"> <script>
SelectList('<select name="Hphone1" style=width:149px;>' +
' <option value="" selected> ----- 뮤직트로트 ---- </option>' +
' <option value="http://xtx.kr">자바스크립트 </option>' +
' <option value="http://xtx.kr">동영상편집강좌 </option>' +
' <option value="http://xtx.kr">계정DB관리 </option>' +
' <option value="http://xtx.kr">메인페이지</option>' +
' <option value="http://xtx.kr">자료실</option>' +
' <option value="http://xtx.kr">게시판</option>' +
'</select>', 'FFFFFF', '1');
</script> </td>
</tr>
</table>