웹마스터 팁
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
http://sunga.ivyro.net/test/tag.html이번에는 링크 타켓 설정이 새로운 창으로 열리는 new 혹은 blank 소스입니다.
아주 긴 스크립터 소스는 아래 예제소스와 같이 문서 해드안에 넣어주시고
나머지 메뉴소스는 바디안에 넣어 주시고 링크 수정해서 사용하시면 됩니다.
태그연습장소스 주소입니다. 아래클릭해서 소스 몽창 복사해서 일단 미리보기 실행 해보세요~
태그연습장 주소 : http://sunga.ivyro.net/test/tag.html
소스 잘만 수정하면 마우스 오브시에 테두리 색상변경과 메뉴고를때 비지색상과
백그라운드 색상 모두 수정 가능합니다. ^^*
잘만 활용하면 메뉴로도 활용이 가능합니다.
아래 올린 것은 하나짜리고 이번에는 제가 응용해서 가로 메뉴로 변신 시켜봤습니다.
스샷 이미지 올린거 그대로 입니다. - 테두리색상을 제가 흰색으로 설정했는데
본인들이 메뉴는 알아서 수정해서 사용 하시기 바랍니다.
================== 소스 시작 ===========요 아래부터 끝까지 복사하세요 ============
<html>
<head>
<title>연습할 제목</title>
<html>
<head>
<title>연습할 제목</title>
<script>
var SS_ENV = new Object();
SS_ENV.IE_Version = new Number(((window.navigator.appVersion.split('; '))[1].split(' '))[1]);
SS_ENV.CR = new Object();
SS_ENV.CR.ReverseBackground = '#000000'; //목록 마우스 오버 색상
SS_ENV.CR.ReverseText = 'white'; //목록선택시 텍스트 색상
SS_ENV.CR.Border = 'white'; //셀렉트 메뉴 테두리 색상
SS_ENV.CR.BorderActive = '#FF0000'; //셀렉트 메뉴에 마우스 오버 색상
SS_ENV.ImgPrefix = 'http://www.blueb.co.kr/SRC/javascript/image1/'; //이미지 경로
SS_ENV.DefaultHeight = 18; //셀렉트 메뉴 높이
SS_ENV.ButtonWidth = 30; //버튼 가로크기
SS_ENV.OptionsDivStyle = ''
+ ' display:none;'
+ ' z-index:10;'
+ ' position:absolute;'
+ ' border:1 solid '+ SS_ENV.CR.Border+';'
+ ' background-color:white;'
+ ' scrollbar-face-color:#D4D0C8;'
+ ' scrollbar-shadow-color:white;'
+ ' scrollbar-highlight-color:#F6F5F4;'
+ ' scrollbar-3dlight-color:white'
+ '+ ' scrollbar-darkshadow-color:#86837E;'
+ ' scrollbar-track-color:#F6F5F4;'
+ ' scrollbar-arrow-color:#EBEBEB;';
SS_ENV.OptionNobrStyle = ''
+ ' font-size:8.6pt;'
+ ' font-family:굴림;';
var SS_VAR = new Object();
SS_VAR.DivDummy = document.createElement("DIV");
SS_VAR.SelectList = new Array();
SS_VAR.bEventAttached = false;
var SS_CreatedElements = new Object();
function unloadObjects() {
try {
if (SS_VAR && SS_VAR.SelectList) {
for (key in SS_VAR.SelectList) {
if (SS_VAR.SelectList[key]) {
try {
SS_VAR.SelectList[key].select.setAttribute('SS', 0);
} catch (e) {};
delete SS_VAR.SelectList[key];
}
}
}
} catch (e) {};
}
attachEvent("onunload", unloadObjects);
function SS_create (srcHTML, ListMax, bAutoDetect) {
this.ssID = SS_VAR.SelectList.length;
this.bOriginalSelect = (bAutoDetect && SS_ENV.IE_Version < 5.5);
this.select = SS_createElement(srcHTML);
this.selectedIndex = this.select.selectedIndex;
this.options = this.select.options;
this.width = parseInt(this.select.style.width);
this.height = (this.select.style.height) ? parseInt(this.select.style.height) : SS_ENV.DefaultHeight;
this.OptionHeight = this.height - 4;
this.bListDown = (ListMax && '-'==ListMax.toString().substr(0, 1)) ? false : true;
this.ListMax = (!isNaN(parseInt(ListMax))) ? Math.abs(ListMax) : 100;
this.Table;
this.TitleDiv;
this.TitleTable;
this.TitleWrapper;
this.OptionsDiv;
this.OptionsWrapper;
this.OptionsTable;
this.bFocused = false;
this.bExpanded = false;
this.bReverse = false;
// private method
this.isThisEventToBeCanceled = SS_isThisEventToBeCanceled;
this.toggleTitle = SS_toggleTitle;
this.syncSelectedIndex = SS_syncSelectedIndex;
this.toggleOptions = SS_toggleOptions;
this.turnOnOption = SS_turnOnOption;
this.turnOffOption = SS_turnOffOption;
this.handleMousewheel = SS_handleMousewheel;
this.handleOverTitle = SS_handleOverTitle;
this.handleOutTitle = SS_handleOutTitle;
this.handleOverOption = SS_handleOverOption;
this.createTable = SS_createTable;
this.createTitleDiv = SS_createTitleDiv;
this.createOptionsDiv = SS_createOptionsDiv;
this.createOptionTr = SS_createOptionTr;
this.adjustOptionsDiv = SS_adjustOptionsDiv;
this.syncOptions = SS_syncOptions;
this.pressOption = SS_pressOption;
this.moveOption = SS_moveOption;
this.releaseOption = SS_releaseOption;
this.pressTitle = SS_pressTitle;
this.releaseTitle = SS_releaseTitle;
// public method
this.display = SS_display;
this.insertOption = SS_insertOption;
this.deleteOption = SS_deleteOption;
this.changeOption = SS_changeOption;
// initiate
this.createTable();
this.select.setAttribute('SS', this);
if (!this.bOriginalSelect)
this.select.onpropertychange = SS_handlePropertychange;
SS_VAR.SelectList[this.ssID] = this;
}
function SS_display() {
document.write("<div id=SS_TempDiv></div>n");
document.all.SS_TempDiv.appendChild(this.Table);
document.all.SS_TempDiv.removeNode();
}
function SS_write (srcHTML, ListMax, bAutoDetect) {
var oSS = new SS_create(srcHTML, ListMax, bAutoDetect);
oSS.display();
return oSS;
}
function SS_insertOption (value, innerText, idx) {
var NewOption = document.createElement("OPTION");
SS_CreatedElements[SS_CreatedElements.length] = NewOption;
this.options.add(NewOption, idx);
NewOption.innerText = innerText;
NewOption.value = value;
if (!this.bOriginalSelect) this.createOptionTr(idx);
this.syncOptions();
this.adjustOptionsDiv();
this.syncSelectedIndex();
}
function SS_deleteOption (idx){
this.options.remove(idx);
if (!this.bOriginalSelect) this.OptionsTable.deleteRow(idx);
this.syncOptions();
this.adjustOptionsDiv();
this.syncSelectedIndex();
}
function SS_changeOption (idx, value, innerText) {
this.options[idx].value = value;
this.options[idx].innerText = innerText;
this.syncOptions();
this.syncSelectedIndex();
}
function SS_cancelEvent (event) {
event.cancelBubble = true;
event.returnValue = false;
}
function SS_isThisEventToBeCanceled (event) {
if ('object' == typeof(event)) {
switch(event.type) {
case 'mousedown':
if (!(event.button & 1)) return true;
break;
case 'mouseup':
if (!(event.button & 1)) return true;
if (SS_ENV.IE_Version >= 5.5 && event.srcElement != this.srcElementOfLastMousedown && this.srcElementOfLastMousedown != null) {
this.srcElementOfLastMousedown = null;
return true;
}
break;
case 'mouseout':
if (!(SS_ENV.IE_Version < 5.5 && event.srcElement == this.srcElementOfLastMousedown))
return true;
break;
case 'mousemove':
if (SS_ENV.IE_Version >= 5.5 && event.srcElement != this.srcElementOfLastMousedown && this.srcElementOfLastMousedown != null)
return true;
break;
}
}
return false;
}
function SS_createElement(html) {
SS_VAR.DivDummy.insertAdjacentHTML('afterBegin', html);
var oEl = SS_VAR.DivDummy.children(0);
while (SS_VAR.DivDummy.children.length > 0) {
SS_VAR.DivDummy.removeChild(SS_VAR.DivDummy.children(0));
}
return oEl;
}
function SS_blurExcept(except) {
SS_cancelEvent(window.event);
except = ('number'==typeof(except)) ? except : -1;
var bHasToDetachEvent = true;
for (var i=0; i < SS_VAR.SelectList.length; i++) {
if (-1==except && SS_VAR.SelectList[i].bFocused && SS_VAR.SelectList[i].bExpanded) {
SS_VAR.SelectList[i].toggleOptions(false, true);
SS_VAR.SelectList[i].toggleTitle(true);
bHasToDetachEvent = false;
}
else if (i!=except) {
if (SS_VAR.SelectList[i].bExpanded)
SS_VAR.SelectList[i].toggleOptions(false, true);
if (SS_VAR.SelectList[i].bReverse)
SS_VAR.SelectList[i].toggleTitle(false);
SS_VAR.SelectList[i].bFocused = false;
}
}
if (SS_VAR.bEventAttached && bHasToDetachEvent) {
document.detachEvent('onmousedown', SS_blurExcept);
document.detachEvent('ondblclick', SS_blurExcept);
SS_VAR.bEventAttached = false;
}
}
function SS_syncSelectedIndex() {
this.selectedIndex = this.select.selectedIndex;
if (this.bOriginalSelect) return;
if (this.TitleTable.cells(0).childNodes(0).innerText != this.options[this.selectedIndex].innerText)
this.TitleTable.cells(0).childNodes(0).innerText = this.options[this.selectedIndex].innerText;
if (this.bExpanded)
this.toggleOptions(false);
}
function SS_toggleTitle(bReverse){
this.bReverse = ('undefined'!=typeof(bReverse)) ? bReverse: (!this.bReverse);
this.TitleTable.cells(0).style.backgroundColor = this.bReverse ? SS_ENV.CR.ReverseBackground : '';
this.TitleTable.cells(0).style.color = this.bReverse ? SS_ENV.CR.ReverseText : '';
}
function SS_toggleOptions (bExpanded, bStrict) {
if (!bStrict && !this.bFocused) {
SS_blurExcept(this.ssID);
}
this.bExpanded = ('undefined'!=typeof(bExpanded)) ? bExpanded: (!this.bExpanded);
if (this.bExpanded) {
this.adjustOptionsDiv();
this.OptionsDiv.style.display = 'block';
if (!bStrict) {
this.toggleTitle(false);
this.handleOverOption(this.selectedIndex);
}
this.handleOutTitle();
}
else {
this.OptionsDiv.style.display = 'none';
if (!bStrict) {
this.toggleTitle(true);
}
}
if (!bStrict) {
this.bFocused = true;
if (!SS_VAR.bEventAttached) {
document.attachEvent('onmousedown', SS_blurExcept);
document.attachEvent('ondblclick', SS_blurExcept);
SS_VAR.bEventAttached = true;
}
}
}
function SS_handlePropertychange ()
{
if ('propertychange'==window.event.type && 'selectedIndex'==window.event.propertyName) {
var oSS = window.event.srcElement.SS;
oSS.syncSelectedIndex();
if (null != oSS.select.onchange)
oSS.select.onchange();
}
}
function SS_handleMousewheel (event) {
var idx = this.selectedIndex;
if ('mousewheel'==event.type && this.bFocused && this.bReverse) {
for (var i=0; i < event.wheelDelta; i += 120) idx--;
for (var i=0; i > event.wheelDelta; i -= 120) idx++;
}
idx = Math.max(idx, 0);
idx = Math.min(idx, this.options.length - 1);
this.select.selectedIndex = idx;
}
function SS_handleOverTitle() {
if (this.bExpanded) return;
this.TitleTable.style.borderColor = SS_ENV.CR.BorderActive;
this.TitleTable.cells(1).style.display = 'none';
this.TitleTable.cells(2).style.display = 'block';
}
function SS_handleOutTitle() {
this.TitleTable.style.borderColor = SS_ENV.CR.Border;
this.TitleTable.cells(2).style.display = 'none';
this.TitleTable.cells(1).style.display = 'block';
}
function SS_handleOverOption(idx) {
for (var i=0; i < this.options.length; i++) {
if (i==idx) this.turnOnOption(i);
else this.turnOffOption(i);
}
}
function SS_turnOnOption(idx) {
this.OptionsTable.cells(idx).style.color = SS_ENV.CR.ReverseText;
this.OptionsTable.cells(idx).style.backgroundColor = SS_ENV.CR.ReverseBackground;
}
function SS_turnOffOption(idx) {
this.OptionsTable.cells(idx).style.color = '#868686';
this.OptionsTable.cells(idx).style.backgroundColor = '#F3F3F3';
}
function SS_adjustOptionsDiv() {
if (this.bOriginalSelect) return;
this.OptionsDiv.style.width = this.width;
this.OptionsDiv.style.height = Math.min(this.options.length, this.ListMax) * this.OptionHeight + 2;
this.OptionsWrapper.style.height = this.options.length * this.OptionHeight;
this.OptionsDiv.style.overflowY = (this.options.length > this.ListMax) ? 'scroll' : '';
var top = this.Table.offsetTop;
var left = this.Table.offsetLeft;
for (var El = this.Table.offsetParent; 'BODY'!=El.tagName && 'absolute'!=El.style.position && 'relative'!=El.style.position; El = El.offsetParent) {
if ('TABLE' != El.tagName) {
top += El.clientTop;
left += El.clientLeft;
}
top += El.offsetTop;
left += El.offsetLeft;
}
this.OptionsDiv.style.top = (this.bListDown) ? (top + this.height) : (top - parseInt(this.OptionsDiv.style.height));
this.OptionsDiv.style.left = left;
this.TitleWrapper.style.top = 0;
this.TitleWrapper.style.left = 0;
}
function SS_syncOptions(){
if (this.bOriginalSelect) return;
for (var i=0; i < this.options.length; i++) {
this.OptionsTable.cells(i).setAttribute('index', i);
if (this.OptionsTable.cells(i).childNodes(0).innerText != this.options[i].innerText)
this.OptionsTable.cells(i).childNodes(0).innerText = this.options[i].innerText;
}
}
function SS_pressTitle(event){
SS_cancelEvent(event);
this.srcElementOfLastMousedown = event.srcElement;
this.toggleOptions();
}
function SS_releaseTitle(event) {
SS_cancelEvent(event);
if (this.isThisEventToBeCanceled(event)) return;
this.srcElementOfLastMousedown = null;
}
function SS_pressOption(event) {
SS_cancelEvent(event);
this.srcElementOfLastMousedown = event.srcElement;
}
function SS_moveOption(event) {
SS_cancelEvent(event);
if (this.isThisEventToBeCanceled(event)) return;
if (!(event.offsetX >= 0 && event.offsetX <= this.OptionsTable.offsetWidth)) return;
this.handleOverOption(Math.floor(event.offsetY / this.OptionHeight));
}
function SS_releaseOption(event){
SS_cancelEvent(event);
if (this.isThisEventToBeCanceled(event)) return;
this.srcElementOfLastMousedown = null;
if (event.offsetX >= 0 && event.offsetX <= this.OptionsTable.offsetWidth) {
this.toggleOptions(false);
this.select.selectedIndex = Math.floor(event.offsetY / this.OptionHeight);
}
}
function SS_createTable() {
this.Table = SS_createElement(""
+ "<table border=0 cellpadding=0 cellspacing=0 style='table-layout:fixed; cursor:default'>"
+ "<tr><td></td></tr>"
+ "</table>"
);
if (!isNaN(this.width)) this.Table.style.width = this.width;
this.Table.style.height = this.height;
if (!this.bOriginalSelect) {
this.createTitleDiv();
this.createOptionsDiv();
this.Table.cells(0).appendChild(this.TitleDiv);
this.Table.cells(0).appendChild(this.OptionsDiv);
}
else {
this.Table.cells(0).appendChild(this.select);
}
}
function SS_createTitleDiv() {
this.TitleDiv = SS_createElement(""
+ "<div style='position:relative; top:0; left:0;'>"
+ " <table border=0 cellpadding=0 cellspacing=1"
+ " height="+this.height
+ " bgcolor=#ffffff"
+ " style='table-layout:fixed; border:1 solid "+SS_ENV.CR.Border+";'"
+ " onmouseover='SS_VAR.SelectList["+this.ssID+"].adjustOptionsDiv()'"
+ " >"
+ " <tr>"
+ " <td><nobr style='text-oveflow:hidden;"+SS_ENV.OptionNobrStyle+"'></nobr></td>"
+ " <td width="+SS_ENV.ButtonWidth+" align=center style='word-wrap:normal'></td>"
+ " <td style='display:none' width="+SS_ENV.ButtonWidth+" align=center style='word-wrap:normal'></td>"
+ " <td style='display:none'></td>"
+ " </tr>"
+ " </table>"
+ "</div>"
);
this.TitleTable = this.TitleDiv.childNodes(0);
this.TitleTable.cells(0).childNodes(0).innerText = this.options[this.selectedIndex].innerText;
this.TitleTable.cells(1).innerHTML = "<img src='"+SS_ENV.ImgPrefix+"/down.gif' border=0 align=absmiddle>";
this.TitleTable.cells(2).innerHTML = "<img src='"+SS_ENV.ImgPrefix+"/down_s.gif' border=0 align=absmiddle>";
this.TitleTable.cells(3).appendChild(this.select);
this.TitleWrapper = document.createElement(""
+ "<img src='"+SS_ENV.ImgPrefix+"/blank.gif'"
+ " style='position:absolute; top:0; left:0; z-index:2; width:100%; height:"+this.height+";'"
+ " onmouseover='SS_VAR.SelectList["+this.ssID+"].handleOverTitle()'"
+ " onmouseout='SS_VAR.SelectList["+this.ssID+"].handleOutTitle(); SS_VAR.SelectList["+this.ssID+"].releaseTitle(window.event);'"
+ " onmousedown='SS_VAR.SelectList["+this.ssID+"].pressTitle(window.event)'"
+ " ondblclick='SS_VAR.SelectList["+this.ssID+"].pressTitle(window.event); SS_VAR.SelectList["+this.ssID+"].releaseTitle(window.event);'"
+ " onmouseup='SS_VAR.SelectList["+this.ssID+"].releaseTitle(window.event)'"
+ " onmousewheel='SS_VAR.SelectList["+this.ssID+"].handleMousewheel(window.event)'"
+ " ondragstart='SS_cancelEvent(window.event)'"
+ ">"
);
SS_CreatedElements[SS_CreatedElements.length] = this.TitleWrapper;
this.TitleDiv.appendChild(this.TitleWrapper);
}
function SS_createOptionsDiv() {
this.OptionsDiv = SS_createElement(""
+ "<div style='"+SS_ENV.OptionsDivStyle+"'"
+ " onscroll='SS_VAR.SelectList["+this.ssID+"].moveOption(window.event)'"
+ " onmousedown='SS_cancelEvent(window.event)'"
+ ">"
+ " <table border=0 cellpadding=0 cellspacing=0 width=100% style='table-layout:fixed'>"
+ " </table>"
+ "</div>"
);
this.OptionsTable = this.OptionsDiv.childNodes(0);
for (var i=0; i < this.options.length; i++) {
this.createOptionTr(i);
}
this.syncOptions();
this.OptionsWrapper = document.createElement(""
+ "<img src='"+SS_ENV.ImgPrefix+"/blank.gif'"
+ " style='position:absolute; top:0; left:0; width:100%;'"
+ " onmousedown='SS_VAR.SelectList["+this.ssID+"].pressOption(window.event)'"
+ " onmousemove='SS_VAR.SelectList["+this.ssID+"].moveOption(window.event)'"
+ " onmouseup='SS_VAR.SelectList["+this.ssID+"].releaseOption(window.event)'"
+ " onmouseout='SS_VAR.SelectList["+this.ssID+"].releaseOption(window.event)'"
+ " ondragstart='SS_cancelEvent(window.event)'"
+ ">"
);
SS_CreatedElements[SS_CreatedElements.length] = this.OptionsWrapper;
this.OptionsDiv.appendChild(this.OptionsWrapper);
}
function SS_createOptionTr(idx) {
idx = ('undefined'!=typeof(idx)) ? idx : this.options.length - 1;
var OptionTr = this.OptionsTable.insertRow(-1);
var OptionTd = document.createElement("<td height="+this.OptionHeight+"></td>");
SS_CreatedElements[SS_CreatedElements.length] = this.OptionsTd;
OptionTd.appendChild(document.createElement("<nobr style='"+SS_ENV.OptionNobrStyle+"'></nobr>"));
OptionTr.appendChild(OptionTd);
}
function Menu_Change(Obj) {
var f=document.form1;
var _Obj=Obj.selectedIndex;
if(Obj.options[_Obj].value) window.open(Obj.options[_Obj].value,"");
else return false;
}
</script>
</head>
<body>
<TABLE WIDTH=710 BORDER=0 CELLPADDING=0 CELLSPACING=0>
<TD WIDTH=100 HEIGHT=22 BGCOLOR=#FFFFFF align="center">
<Script>
SS_write("<select name='selemail' onChange='Menu_Change(this)' STYLE='width : 88px'>n"
+"<option selected value=''>About Us</option>"
+"<option value='http://www.myswish.co.kr/'>성아의홈 소개</option>"
+"<option value='http://www.phpschool.com/index.php'>관리자 프로필</option>"
+"<option value='http://studyweb.infomaster.co.kr/'>운영자 소개</option>"
+"<option value='http://msh38.netian.com/content.htm'>레벨(등급)공지</option>"
+"<option value='http://rosun1004.co.kr/'>포트폴리오</option>"
+"<option value='http://www.photomoa.co.kr/'>Photo</option>"
+"</select>");
</Script>
</TD>
<TD WIDTH=100 HEIGHT=22 BGCOLOR=#FFFFFF align="center">
<Script>
SS_write("<select name='selemail' onChange='Menu_Change(this)' STYLE='width : 100px'>n"
+"<option selected value=''>Study & Tip</option>"
+"<option value='http://www.myswish.co.kr/'>포토샵강좌모음</option>"
+"<option value='http://www.phpschool.com/index.php'>나모/드림위버</option>"
+"<option value='http://studyweb.infomaster.co.kr/'>플래시</option>"
+"<option value='http://msh38.netian.com/content.htm'>스위시</option>"
+"<option value='http://rosun1004.co.kr/'>기타 웹강좌모음</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>HTML강좌</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>자바스크립터강좌</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>팁&테크닉</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>성아 포토샵강좌</option>"
+"</select>");
</Script>
</TD>
<TD WIDTH=105 HEIGHT=22 BGCOLOR=#fffff align="center">
<Script>
SS_write("<select name='selemail' onChange='Menu_Change(this)' STYLE='width : 105px'>n"
+"<option selected value=''>Web Desgin</option>"
+"<option value='http://www.myswish.co.kr/'>이미지 모음</option>"
+"<option value='http://www.phpschool.com/index.php'>템플릿 모음</option>"
+"<option value='http://studyweb.infomaster.co.kr/'>멋진 사이트 캡춰</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>레이아웃 모음</option>"
+"<option value='http://www.myswish.co.kr/'>성아 레이아웃</option>"
+"<option value='http://www.phpschool.com/index.php'>고급 레이아웃</option>"
+"<option value='http://studyweb.infomaster.co.kr/'>자바스크립터 소스</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>태그소스</option>"
+"<option value='http://studyweb.infomaster.co.kr/'>추천 제로보드스킨</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>성아 제로보드스킨</option>"
+"</select>");
</Script>
</TD>
<TD WIDTH=100 HEIGHT=22 BGCOLOR=#FFFFFF align="center">
<Script>
SS_write("<select name='selemail' onChange='Menu_Change(this)' STYLE='width : 90px'>n"
+"<option selected value=''>Download</option>"
+"<option value='http://www.myswish.co.kr/'>성아의홈 소개</option>"
+"<option value='http://www.phpschool.com/index.php'>관리자 프로필</option>"
+"<option value='http://studyweb.infomaster.co.kr/'>운영자 소개</option>"
+"<option value='http://msh38.netian.com/content.htm'>레벨(등급)공지</option>"
+"<option value='http://rosun1004.co.kr/'>포트폴리오</option>"
+"<option value='http://www.photomoa.co.kr/'>Photo</option>"
+"</select>");
</Script>
</TD>
<TD WIDTH=100 HEIGHT=22 BGCOLOR=#FFFFFF align="center">
<Script>
SS_write("<select name='selemail' onChange='Menu_Change(this)' STYLE='width : 95px'>n"
+"<option selected value=''>Community</option>"
+"<option value='http://www.myswish.co.kr/'>포토샵강좌모음</option>"
+"<option value='http://www.phpschool.com/index.php'>나모/드림위버</option>"
+"<option value='http://studyweb.infomaster.co.kr/'>플래시</option>"
+"<option value='http://msh38.netian.com/content.htm'>스위시</option>"
+"<option value='http://rosun1004.co.kr/'>기타 웹강좌모음</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>HTML강좌</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>자바스크립터강좌</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>팁&테크닉</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'+ '>성아 포토샵강좌</option>"
+"</select>");
</Script>
</TD>
<TD WIDTH=100 HEIGHT=22 BGCOLOR=#fffff align="center">
<Script>
SS_write("<select name='selemail' onChange='Menu_Change(this)' STYLE='width : 100px'>n"
+"<option selected value=''>Good Link</option>"
+"<option value='http://www.myswish.co.kr/'+ '>이미지 모음</option>"
+"<option value='http://www.phpschool.com/index.php'>템플릿 모음</option>"
+"<option value='http://studyweb.infomaster.co.kr/'>멋진 사이트 캡춰</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>레이아웃 모음</option>"
+"<option value='http://www.myswish.co.kr/'>성아 레이아웃</option>"
+"<option value='http://www.phpschool.com/index.php'>고급 레이아웃</option>"
+"<option value='http://studyweb.infomaster.co.kr/'>자바스크립터 소스</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>태그소스</option>"
+"<option value='http://studyweb.infomaster.co.kr/'>추천 제로보드스킨</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>성아 제로보드스킨</option>"
+"</select>");
</Script>
</TD>
</body>
</html>
셀렉트박스 트리메뉴인데 참 이뻐요(링크타켓 - new/blank)
2006.09.19 14:15
http://sunga.ivyro.net/test/tag.html이번에는 링크 타켓 설정이 새로운 창으로 열리는 new 혹은 blank 소스입니다.
아주 긴 스크립터 소스는 아래 예제소스와 같이 문서 해드안에 넣어주시고
나머지 메뉴소스는 바디안에 넣어 주시고 링크 수정해서 사용하시면 됩니다.
태그연습장소스 주소입니다. 아래클릭해서 소스 몽창 복사해서 일단 미리보기 실행 해보세요~
태그연습장 주소 : http://sunga.ivyro.net/test/tag.html
소스 잘만 수정하면 마우스 오브시에 테두리 색상변경과 메뉴고를때 비지색상과
백그라운드 색상 모두 수정 가능합니다. ^^*
잘만 활용하면 메뉴로도 활용이 가능합니다.
아래 올린 것은 하나짜리고 이번에는 제가 응용해서 가로 메뉴로 변신 시켜봤습니다.
스샷 이미지 올린거 그대로 입니다. - 테두리색상을 제가 흰색으로 설정했는데
본인들이 메뉴는 알아서 수정해서 사용 하시기 바랍니다.
================== 소스 시작 ===========요 아래부터 끝까지 복사하세요 ============
<html>
<head>
<title>연습할 제목</title>
<html>
<head>
<title>연습할 제목</title>
<script>
var SS_ENV = new Object();
SS_ENV.IE_Version = new Number(((window.navigator.appVersion.split('; '))[1].split(' '))[1]);
SS_ENV.CR = new Object();
SS_ENV.CR.ReverseBackground = '#000000'; //목록 마우스 오버 색상
SS_ENV.CR.ReverseText = 'white'; //목록선택시 텍스트 색상
SS_ENV.CR.Border = 'white'; //셀렉트 메뉴 테두리 색상
SS_ENV.CR.BorderActive = '#FF0000'; //셀렉트 메뉴에 마우스 오버 색상
SS_ENV.ImgPrefix = 'http://www.blueb.co.kr/SRC/javascript/image1/'; //이미지 경로
SS_ENV.DefaultHeight = 18; //셀렉트 메뉴 높이
SS_ENV.ButtonWidth = 30; //버튼 가로크기
SS_ENV.OptionsDivStyle = ''
+ ' display:none;'
+ ' z-index:10;'
+ ' position:absolute;'
+ ' border:1 solid '+ SS_ENV.CR.Border+';'
+ ' background-color:white;'
+ ' scrollbar-face-color:#D4D0C8;'
+ ' scrollbar-shadow-color:white;'
+ ' scrollbar-highlight-color:#F6F5F4;'
+ ' scrollbar-3dlight-color:white'
+ '+ ' scrollbar-darkshadow-color:#86837E;'
+ ' scrollbar-track-color:#F6F5F4;'
+ ' scrollbar-arrow-color:#EBEBEB;';
SS_ENV.OptionNobrStyle = ''
+ ' font-size:8.6pt;'
+ ' font-family:굴림;';
var SS_VAR = new Object();
SS_VAR.DivDummy = document.createElement("DIV");
SS_VAR.SelectList = new Array();
SS_VAR.bEventAttached = false;
var SS_CreatedElements = new Object();
function unloadObjects() {
try {
if (SS_VAR && SS_VAR.SelectList) {
for (key in SS_VAR.SelectList) {
if (SS_VAR.SelectList[key]) {
try {
SS_VAR.SelectList[key].select.setAttribute('SS', 0);
} catch (e) {};
delete SS_VAR.SelectList[key];
}
}
}
} catch (e) {};
}
attachEvent("onunload", unloadObjects);
function SS_create (srcHTML, ListMax, bAutoDetect) {
this.ssID = SS_VAR.SelectList.length;
this.bOriginalSelect = (bAutoDetect && SS_ENV.IE_Version < 5.5);
this.select = SS_createElement(srcHTML);
this.selectedIndex = this.select.selectedIndex;
this.options = this.select.options;
this.width = parseInt(this.select.style.width);
this.height = (this.select.style.height) ? parseInt(this.select.style.height) : SS_ENV.DefaultHeight;
this.OptionHeight = this.height - 4;
this.bListDown = (ListMax && '-'==ListMax.toString().substr(0, 1)) ? false : true;
this.ListMax = (!isNaN(parseInt(ListMax))) ? Math.abs(ListMax) : 100;
this.Table;
this.TitleDiv;
this.TitleTable;
this.TitleWrapper;
this.OptionsDiv;
this.OptionsWrapper;
this.OptionsTable;
this.bFocused = false;
this.bExpanded = false;
this.bReverse = false;
// private method
this.isThisEventToBeCanceled = SS_isThisEventToBeCanceled;
this.toggleTitle = SS_toggleTitle;
this.syncSelectedIndex = SS_syncSelectedIndex;
this.toggleOptions = SS_toggleOptions;
this.turnOnOption = SS_turnOnOption;
this.turnOffOption = SS_turnOffOption;
this.handleMousewheel = SS_handleMousewheel;
this.handleOverTitle = SS_handleOverTitle;
this.handleOutTitle = SS_handleOutTitle;
this.handleOverOption = SS_handleOverOption;
this.createTable = SS_createTable;
this.createTitleDiv = SS_createTitleDiv;
this.createOptionsDiv = SS_createOptionsDiv;
this.createOptionTr = SS_createOptionTr;
this.adjustOptionsDiv = SS_adjustOptionsDiv;
this.syncOptions = SS_syncOptions;
this.pressOption = SS_pressOption;
this.moveOption = SS_moveOption;
this.releaseOption = SS_releaseOption;
this.pressTitle = SS_pressTitle;
this.releaseTitle = SS_releaseTitle;
// public method
this.display = SS_display;
this.insertOption = SS_insertOption;
this.deleteOption = SS_deleteOption;
this.changeOption = SS_changeOption;
// initiate
this.createTable();
this.select.setAttribute('SS', this);
if (!this.bOriginalSelect)
this.select.onpropertychange = SS_handlePropertychange;
SS_VAR.SelectList[this.ssID] = this;
}
function SS_display() {
document.write("<div id=SS_TempDiv></div>n");
document.all.SS_TempDiv.appendChild(this.Table);
document.all.SS_TempDiv.removeNode();
}
function SS_write (srcHTML, ListMax, bAutoDetect) {
var oSS = new SS_create(srcHTML, ListMax, bAutoDetect);
oSS.display();
return oSS;
}
function SS_insertOption (value, innerText, idx) {
var NewOption = document.createElement("OPTION");
SS_CreatedElements[SS_CreatedElements.length] = NewOption;
this.options.add(NewOption, idx);
NewOption.innerText = innerText;
NewOption.value = value;
if (!this.bOriginalSelect) this.createOptionTr(idx);
this.syncOptions();
this.adjustOptionsDiv();
this.syncSelectedIndex();
}
function SS_deleteOption (idx){
this.options.remove(idx);
if (!this.bOriginalSelect) this.OptionsTable.deleteRow(idx);
this.syncOptions();
this.adjustOptionsDiv();
this.syncSelectedIndex();
}
function SS_changeOption (idx, value, innerText) {
this.options[idx].value = value;
this.options[idx].innerText = innerText;
this.syncOptions();
this.syncSelectedIndex();
}
function SS_cancelEvent (event) {
event.cancelBubble = true;
event.returnValue = false;
}
function SS_isThisEventToBeCanceled (event) {
if ('object' == typeof(event)) {
switch(event.type) {
case 'mousedown':
if (!(event.button & 1)) return true;
break;
case 'mouseup':
if (!(event.button & 1)) return true;
if (SS_ENV.IE_Version >= 5.5 && event.srcElement != this.srcElementOfLastMousedown && this.srcElementOfLastMousedown != null) {
this.srcElementOfLastMousedown = null;
return true;
}
break;
case 'mouseout':
if (!(SS_ENV.IE_Version < 5.5 && event.srcElement == this.srcElementOfLastMousedown))
return true;
break;
case 'mousemove':
if (SS_ENV.IE_Version >= 5.5 && event.srcElement != this.srcElementOfLastMousedown && this.srcElementOfLastMousedown != null)
return true;
break;
}
}
return false;
}
function SS_createElement(html) {
SS_VAR.DivDummy.insertAdjacentHTML('afterBegin', html);
var oEl = SS_VAR.DivDummy.children(0);
while (SS_VAR.DivDummy.children.length > 0) {
SS_VAR.DivDummy.removeChild(SS_VAR.DivDummy.children(0));
}
return oEl;
}
function SS_blurExcept(except) {
SS_cancelEvent(window.event);
except = ('number'==typeof(except)) ? except : -1;
var bHasToDetachEvent = true;
for (var i=0; i < SS_VAR.SelectList.length; i++) {
if (-1==except && SS_VAR.SelectList[i].bFocused && SS_VAR.SelectList[i].bExpanded) {
SS_VAR.SelectList[i].toggleOptions(false, true);
SS_VAR.SelectList[i].toggleTitle(true);
bHasToDetachEvent = false;
}
else if (i!=except) {
if (SS_VAR.SelectList[i].bExpanded)
SS_VAR.SelectList[i].toggleOptions(false, true);
if (SS_VAR.SelectList[i].bReverse)
SS_VAR.SelectList[i].toggleTitle(false);
SS_VAR.SelectList[i].bFocused = false;
}
}
if (SS_VAR.bEventAttached && bHasToDetachEvent) {
document.detachEvent('onmousedown', SS_blurExcept);
document.detachEvent('ondblclick', SS_blurExcept);
SS_VAR.bEventAttached = false;
}
}
function SS_syncSelectedIndex() {
this.selectedIndex = this.select.selectedIndex;
if (this.bOriginalSelect) return;
if (this.TitleTable.cells(0).childNodes(0).innerText != this.options[this.selectedIndex].innerText)
this.TitleTable.cells(0).childNodes(0).innerText = this.options[this.selectedIndex].innerText;
if (this.bExpanded)
this.toggleOptions(false);
}
function SS_toggleTitle(bReverse){
this.bReverse = ('undefined'!=typeof(bReverse)) ? bReverse: (!this.bReverse);
this.TitleTable.cells(0).style.backgroundColor = this.bReverse ? SS_ENV.CR.ReverseBackground : '';
this.TitleTable.cells(0).style.color = this.bReverse ? SS_ENV.CR.ReverseText : '';
}
function SS_toggleOptions (bExpanded, bStrict) {
if (!bStrict && !this.bFocused) {
SS_blurExcept(this.ssID);
}
this.bExpanded = ('undefined'!=typeof(bExpanded)) ? bExpanded: (!this.bExpanded);
if (this.bExpanded) {
this.adjustOptionsDiv();
this.OptionsDiv.style.display = 'block';
if (!bStrict) {
this.toggleTitle(false);
this.handleOverOption(this.selectedIndex);
}
this.handleOutTitle();
}
else {
this.OptionsDiv.style.display = 'none';
if (!bStrict) {
this.toggleTitle(true);
}
}
if (!bStrict) {
this.bFocused = true;
if (!SS_VAR.bEventAttached) {
document.attachEvent('onmousedown', SS_blurExcept);
document.attachEvent('ondblclick', SS_blurExcept);
SS_VAR.bEventAttached = true;
}
}
}
function SS_handlePropertychange ()
{
if ('propertychange'==window.event.type && 'selectedIndex'==window.event.propertyName) {
var oSS = window.event.srcElement.SS;
oSS.syncSelectedIndex();
if (null != oSS.select.onchange)
oSS.select.onchange();
}
}
function SS_handleMousewheel (event) {
var idx = this.selectedIndex;
if ('mousewheel'==event.type && this.bFocused && this.bReverse) {
for (var i=0; i < event.wheelDelta; i += 120) idx--;
for (var i=0; i > event.wheelDelta; i -= 120) idx++;
}
idx = Math.max(idx, 0);
idx = Math.min(idx, this.options.length - 1);
this.select.selectedIndex = idx;
}
function SS_handleOverTitle() {
if (this.bExpanded) return;
this.TitleTable.style.borderColor = SS_ENV.CR.BorderActive;
this.TitleTable.cells(1).style.display = 'none';
this.TitleTable.cells(2).style.display = 'block';
}
function SS_handleOutTitle() {
this.TitleTable.style.borderColor = SS_ENV.CR.Border;
this.TitleTable.cells(2).style.display = 'none';
this.TitleTable.cells(1).style.display = 'block';
}
function SS_handleOverOption(idx) {
for (var i=0; i < this.options.length; i++) {
if (i==idx) this.turnOnOption(i);
else this.turnOffOption(i);
}
}
function SS_turnOnOption(idx) {
this.OptionsTable.cells(idx).style.color = SS_ENV.CR.ReverseText;
this.OptionsTable.cells(idx).style.backgroundColor = SS_ENV.CR.ReverseBackground;
}
function SS_turnOffOption(idx) {
this.OptionsTable.cells(idx).style.color = '#868686';
this.OptionsTable.cells(idx).style.backgroundColor = '#F3F3F3';
}
function SS_adjustOptionsDiv() {
if (this.bOriginalSelect) return;
this.OptionsDiv.style.width = this.width;
this.OptionsDiv.style.height = Math.min(this.options.length, this.ListMax) * this.OptionHeight + 2;
this.OptionsWrapper.style.height = this.options.length * this.OptionHeight;
this.OptionsDiv.style.overflowY = (this.options.length > this.ListMax) ? 'scroll' : '';
var top = this.Table.offsetTop;
var left = this.Table.offsetLeft;
for (var El = this.Table.offsetParent; 'BODY'!=El.tagName && 'absolute'!=El.style.position && 'relative'!=El.style.position; El = El.offsetParent) {
if ('TABLE' != El.tagName) {
top += El.clientTop;
left += El.clientLeft;
}
top += El.offsetTop;
left += El.offsetLeft;
}
this.OptionsDiv.style.top = (this.bListDown) ? (top + this.height) : (top - parseInt(this.OptionsDiv.style.height));
this.OptionsDiv.style.left = left;
this.TitleWrapper.style.top = 0;
this.TitleWrapper.style.left = 0;
}
function SS_syncOptions(){
if (this.bOriginalSelect) return;
for (var i=0; i < this.options.length; i++) {
this.OptionsTable.cells(i).setAttribute('index', i);
if (this.OptionsTable.cells(i).childNodes(0).innerText != this.options[i].innerText)
this.OptionsTable.cells(i).childNodes(0).innerText = this.options[i].innerText;
}
}
function SS_pressTitle(event){
SS_cancelEvent(event);
this.srcElementOfLastMousedown = event.srcElement;
this.toggleOptions();
}
function SS_releaseTitle(event) {
SS_cancelEvent(event);
if (this.isThisEventToBeCanceled(event)) return;
this.srcElementOfLastMousedown = null;
}
function SS_pressOption(event) {
SS_cancelEvent(event);
this.srcElementOfLastMousedown = event.srcElement;
}
function SS_moveOption(event) {
SS_cancelEvent(event);
if (this.isThisEventToBeCanceled(event)) return;
if (!(event.offsetX >= 0 && event.offsetX <= this.OptionsTable.offsetWidth)) return;
this.handleOverOption(Math.floor(event.offsetY / this.OptionHeight));
}
function SS_releaseOption(event){
SS_cancelEvent(event);
if (this.isThisEventToBeCanceled(event)) return;
this.srcElementOfLastMousedown = null;
if (event.offsetX >= 0 && event.offsetX <= this.OptionsTable.offsetWidth) {
this.toggleOptions(false);
this.select.selectedIndex = Math.floor(event.offsetY / this.OptionHeight);
}
}
function SS_createTable() {
this.Table = SS_createElement(""
+ "<table border=0 cellpadding=0 cellspacing=0 style='table-layout:fixed; cursor:default'>"
+ "<tr><td></td></tr>"
+ "</table>"
);
if (!isNaN(this.width)) this.Table.style.width = this.width;
this.Table.style.height = this.height;
if (!this.bOriginalSelect) {
this.createTitleDiv();
this.createOptionsDiv();
this.Table.cells(0).appendChild(this.TitleDiv);
this.Table.cells(0).appendChild(this.OptionsDiv);
}
else {
this.Table.cells(0).appendChild(this.select);
}
}
function SS_createTitleDiv() {
this.TitleDiv = SS_createElement(""
+ "<div style='position:relative; top:0; left:0;'>"
+ " <table border=0 cellpadding=0 cellspacing=1"
+ " height="+this.height
+ " bgcolor=#ffffff"
+ " style='table-layout:fixed; border:1 solid "+SS_ENV.CR.Border+";'"
+ " onmouseover='SS_VAR.SelectList["+this.ssID+"].adjustOptionsDiv()'"
+ " >"
+ " <tr>"
+ " <td><nobr style='text-oveflow:hidden;"+SS_ENV.OptionNobrStyle+"'></nobr></td>"
+ " <td width="+SS_ENV.ButtonWidth+" align=center style='word-wrap:normal'></td>"
+ " <td style='display:none' width="+SS_ENV.ButtonWidth+" align=center style='word-wrap:normal'></td>"
+ " <td style='display:none'></td>"
+ " </tr>"
+ " </table>"
+ "</div>"
);
this.TitleTable = this.TitleDiv.childNodes(0);
this.TitleTable.cells(0).childNodes(0).innerText = this.options[this.selectedIndex].innerText;
this.TitleTable.cells(1).innerHTML = "<img src='"+SS_ENV.ImgPrefix+"/down.gif' border=0 align=absmiddle>";
this.TitleTable.cells(2).innerHTML = "<img src='"+SS_ENV.ImgPrefix+"/down_s.gif' border=0 align=absmiddle>";
this.TitleTable.cells(3).appendChild(this.select);
this.TitleWrapper = document.createElement(""
+ "<img src='"+SS_ENV.ImgPrefix+"/blank.gif'"
+ " style='position:absolute; top:0; left:0; z-index:2; width:100%; height:"+this.height+";'"
+ " onmouseover='SS_VAR.SelectList["+this.ssID+"].handleOverTitle()'"
+ " onmouseout='SS_VAR.SelectList["+this.ssID+"].handleOutTitle(); SS_VAR.SelectList["+this.ssID+"].releaseTitle(window.event);'"
+ " onmousedown='SS_VAR.SelectList["+this.ssID+"].pressTitle(window.event)'"
+ " ondblclick='SS_VAR.SelectList["+this.ssID+"].pressTitle(window.event); SS_VAR.SelectList["+this.ssID+"].releaseTitle(window.event);'"
+ " onmouseup='SS_VAR.SelectList["+this.ssID+"].releaseTitle(window.event)'"
+ " onmousewheel='SS_VAR.SelectList["+this.ssID+"].handleMousewheel(window.event)'"
+ " ondragstart='SS_cancelEvent(window.event)'"
+ ">"
);
SS_CreatedElements[SS_CreatedElements.length] = this.TitleWrapper;
this.TitleDiv.appendChild(this.TitleWrapper);
}
function SS_createOptionsDiv() {
this.OptionsDiv = SS_createElement(""
+ "<div style='"+SS_ENV.OptionsDivStyle+"'"
+ " onscroll='SS_VAR.SelectList["+this.ssID+"].moveOption(window.event)'"
+ " onmousedown='SS_cancelEvent(window.event)'"
+ ">"
+ " <table border=0 cellpadding=0 cellspacing=0 width=100% style='table-layout:fixed'>"
+ " </table>"
+ "</div>"
);
this.OptionsTable = this.OptionsDiv.childNodes(0);
for (var i=0; i < this.options.length; i++) {
this.createOptionTr(i);
}
this.syncOptions();
this.OptionsWrapper = document.createElement(""
+ "<img src='"+SS_ENV.ImgPrefix+"/blank.gif'"
+ " style='position:absolute; top:0; left:0; width:100%;'"
+ " onmousedown='SS_VAR.SelectList["+this.ssID+"].pressOption(window.event)'"
+ " onmousemove='SS_VAR.SelectList["+this.ssID+"].moveOption(window.event)'"
+ " onmouseup='SS_VAR.SelectList["+this.ssID+"].releaseOption(window.event)'"
+ " onmouseout='SS_VAR.SelectList["+this.ssID+"].releaseOption(window.event)'"
+ " ondragstart='SS_cancelEvent(window.event)'"
+ ">"
);
SS_CreatedElements[SS_CreatedElements.length] = this.OptionsWrapper;
this.OptionsDiv.appendChild(this.OptionsWrapper);
}
function SS_createOptionTr(idx) {
idx = ('undefined'!=typeof(idx)) ? idx : this.options.length - 1;
var OptionTr = this.OptionsTable.insertRow(-1);
var OptionTd = document.createElement("<td height="+this.OptionHeight+"></td>");
SS_CreatedElements[SS_CreatedElements.length] = this.OptionsTd;
OptionTd.appendChild(document.createElement("<nobr style='"+SS_ENV.OptionNobrStyle+"'></nobr>"));
OptionTr.appendChild(OptionTd);
}
function Menu_Change(Obj) {
var f=document.form1;
var _Obj=Obj.selectedIndex;
if(Obj.options[_Obj].value) window.open(Obj.options[_Obj].value,"");
else return false;
}
</script>
</head>
<body>
<TABLE WIDTH=710 BORDER=0 CELLPADDING=0 CELLSPACING=0>
<TD WIDTH=100 HEIGHT=22 BGCOLOR=#FFFFFF align="center">
<Script>
SS_write("<select name='selemail' onChange='Menu_Change(this)' STYLE='width : 88px'>n"
+"<option selected value=''>About Us</option>"
+"<option value='http://www.myswish.co.kr/'>성아의홈 소개</option>"
+"<option value='http://www.phpschool.com/index.php'>관리자 프로필</option>"
+"<option value='http://studyweb.infomaster.co.kr/'>운영자 소개</option>"
+"<option value='http://msh38.netian.com/content.htm'>레벨(등급)공지</option>"
+"<option value='http://rosun1004.co.kr/'>포트폴리오</option>"
+"<option value='http://www.photomoa.co.kr/'>Photo</option>"
+"</select>");
</Script>
</TD>
<TD WIDTH=100 HEIGHT=22 BGCOLOR=#FFFFFF align="center">
<Script>
SS_write("<select name='selemail' onChange='Menu_Change(this)' STYLE='width : 100px'>n"
+"<option selected value=''>Study & Tip</option>"
+"<option value='http://www.myswish.co.kr/'>포토샵강좌모음</option>"
+"<option value='http://www.phpschool.com/index.php'>나모/드림위버</option>"
+"<option value='http://studyweb.infomaster.co.kr/'>플래시</option>"
+"<option value='http://msh38.netian.com/content.htm'>스위시</option>"
+"<option value='http://rosun1004.co.kr/'>기타 웹강좌모음</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>HTML강좌</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>자바스크립터강좌</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>팁&테크닉</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>성아 포토샵강좌</option>"
+"</select>");
</Script>
</TD>
<TD WIDTH=105 HEIGHT=22 BGCOLOR=#fffff align="center">
<Script>
SS_write("<select name='selemail' onChange='Menu_Change(this)' STYLE='width : 105px'>n"
+"<option selected value=''>Web Desgin</option>"
+"<option value='http://www.myswish.co.kr/'>이미지 모음</option>"
+"<option value='http://www.phpschool.com/index.php'>템플릿 모음</option>"
+"<option value='http://studyweb.infomaster.co.kr/'>멋진 사이트 캡춰</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>레이아웃 모음</option>"
+"<option value='http://www.myswish.co.kr/'>성아 레이아웃</option>"
+"<option value='http://www.phpschool.com/index.php'>고급 레이아웃</option>"
+"<option value='http://studyweb.infomaster.co.kr/'>자바스크립터 소스</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>태그소스</option>"
+"<option value='http://studyweb.infomaster.co.kr/'>추천 제로보드스킨</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>성아 제로보드스킨</option>"
+"</select>");
</Script>
</TD>
<TD WIDTH=100 HEIGHT=22 BGCOLOR=#FFFFFF align="center">
<Script>
SS_write("<select name='selemail' onChange='Menu_Change(this)' STYLE='width : 90px'>n"
+"<option selected value=''>Download</option>"
+"<option value='http://www.myswish.co.kr/'>성아의홈 소개</option>"
+"<option value='http://www.phpschool.com/index.php'>관리자 프로필</option>"
+"<option value='http://studyweb.infomaster.co.kr/'>운영자 소개</option>"
+"<option value='http://msh38.netian.com/content.htm'>레벨(등급)공지</option>"
+"<option value='http://rosun1004.co.kr/'>포트폴리오</option>"
+"<option value='http://www.photomoa.co.kr/'>Photo</option>"
+"</select>");
</Script>
</TD>
<TD WIDTH=100 HEIGHT=22 BGCOLOR=#FFFFFF align="center">
<Script>
SS_write("<select name='selemail' onChange='Menu_Change(this)' STYLE='width : 95px'>n"
+"<option selected value=''>Community</option>"
+"<option value='http://www.myswish.co.kr/'>포토샵강좌모음</option>"
+"<option value='http://www.phpschool.com/index.php'>나모/드림위버</option>"
+"<option value='http://studyweb.infomaster.co.kr/'>플래시</option>"
+"<option value='http://msh38.netian.com/content.htm'>스위시</option>"
+"<option value='http://rosun1004.co.kr/'>기타 웹강좌모음</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>HTML강좌</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>자바스크립터강좌</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>팁&테크닉</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'+ '>성아 포토샵강좌</option>"
+"</select>");
</Script>
</TD>
<TD WIDTH=100 HEIGHT=22 BGCOLOR=#fffff align="center">
<Script>
SS_write("<select name='selemail' onChange='Menu_Change(this)' STYLE='width : 100px'>n"
+"<option selected value=''>Good Link</option>"
+"<option value='http://www.myswish.co.kr/'+ '>이미지 모음</option>"
+"<option value='http://www.phpschool.com/index.php'>템플릿 모음</option>"
+"<option value='http://studyweb.infomaster.co.kr/'>멋진 사이트 캡춰</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>레이아웃 모음</option>"
+"<option value='http://www.myswish.co.kr/'>성아 레이아웃</option>"
+"<option value='http://www.phpschool.com/index.php'>고급 레이아웃</option>"
+"<option value='http://studyweb.infomaster.co.kr/'>자바스크립터 소스</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>태그소스</option>"
+"<option value='http://studyweb.infomaster.co.kr/'>추천 제로보드스킨</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>성아 제로보드스킨</option>"
+"</select>");
</Script>
</TD>
</body>
</html>
댓글 8
-
샤 잉
2006.12.05 22:49
-
뽀因㉦ㅓо Ø Γ
2006.10.21 12:26
스크립터 소스가 길어서 그렇지 절대 복잡한 소스 아닙니다 ㅎㅎ
귀찮은 분들을 위해서 js파일을 링크해드리겠습니다.
http://sunga.ivyro.net/home/say.js
위에 제가 쓰는 js파일을 클릭하신후
다른이름으로 저장해서 그대로 계정에 올린다음 아래 한줄 js소스는 해드안에 넣고
그밑에 스크립터소스는 넣고 싶은 바디 셀안에다 넣어만 주면 되는 간단한 소스 입니다.
위에 js 링크한거 클릭하니깐 주소창 주소가 js 뒤에 br 태그가 붙네요 그거 삭제하고
새로고침하면 바로 다운로드 뜹니다.
<script language="javascript" src="http://홈페이지주소/say.js"></script>
================== 아래는 바디에 삽입하고 주소링크 수정 ======================
<Script>
SS_write("<select name='selemail' onChange='Menu_Change(this)' STYLE='width : 100px'>n"
+"<option selected value=''>Good Link</option>"
+"<option value='http://www.myswish.co.kr/'>이미지 모음</option>"
+"<option value='http://www.phpschool.com/index.php'>템플릿 모음</option>"
+"<option value='+ 'http://studyweb.infomaster.co.kr/'>멋진 사이트 캡춰</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>레이아웃 모음</option>"
+"<option value='http://www.myswish.co.kr/'>성아 레이아웃</option>"
+"<option value='http://www.phpschool.com/index.php'>고급 레이아웃</option>"
+"<option value='http://studyweb.infomaster.co.kr/'>자바스크립터 소스</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>태그소스</option>"
+"<option value='http://studyweb.infomaster.co.kr/'>추천 제로보드스킨</option>"
+"<option value='http://www.sourcenara.com/2004/index.php'>성아 제로보드스킨</option>"
+"</select>");
</Script> -
Mania
2006.09.23 00:56
잘쓸게요~ 감사해요~!! -
뽀因㉦ㅓо Ø Γ
2006.09.24 18:19
아 참고로 해드안에 들어갈 긴 스크립터소스를 js파일로 만들어서
단 한줄짜리 스크립터 소스로 줄여서 사용하는 센스도 있으면 좋겠네요...
js 파일 만드는 방법은 간단합니다.
위에 해드파일안에 있는 스크립터소스만 몽창 복사해서 빈메모장에다 붙여넣고
첫번째와 마지막줄 스크립터 닫는 부분만 빼주고 selet.js 이렇게 이름을 주고
저장을 한다음 계정에 올려서 사용하면 되는데요...
그렇게 완성된 js소스는 아래 소스 입니다.
<script language="javascript" src="http://홈페이지주소/selet.js"></script>
잘모르시겠거나 그림으로 보다 쉽게 설명해둔거 보실려면 아래 주소를 클릭하면 됩니다.
http://sunga.ivyro.net/bbs/zboard.php?id=studi&page=1&sn1=&divpage=1&category=13&sn=off&ss=on&sc=on&select_arrange=headnum&desc=asc&no=617
제홈페이지인데... 그외에도 이쁜 소스 엄청 많습니다.윽 홍보절대 아닙니다 ㅎㅎ
초보분들에게 쉽게 가르쳐주려는 맘이라 생각 해주세요 ^^* -
삐따기
2006.10.04 16:27
이렇게 까지해서 써야하나요 ㅡ.ㅡ;; ㅝ~~~ -
제주바다
2006.10.05 17:27
맘에 드네요^^ 감사! -
NamSoohyun
2006.10.04 12:48
와아 정말 복잡하네요 ㅠ_ㅠ -
뽀因㉦ㅓо Ø Γ
2007.03.22 19:46
아네 잘못 설명했네요 드롭다운메뉴 맞습니다.
허나 기본적인 드롭다운이 아닌 룰오브효과가 들어간 세이클럽
채팅창하단에 있는 왼쪽 귀속말보내기 드롭다운과 같은건데
배경색과 마우스오브시 테두리색상지정등 자유롭게 설정가능해서
자바스크립터소스가 좀깁니다.
어쨋든 위에소스를 복사해서 태그연습장에서 실행해보시면 아실겁니다.
암튼 자바스크립터소스가 너무길어서 제가 js파일을 따로 링크했는데
제홈페이지 주소가 바껴서 아래 다시 올려드리니 아래주소를 복사해서
주소창에 붙여넣고 앤터치면 자동으로 파일이 다운받아지는데 그걸 본인계정에
올리시고 위에처럼 해드부분에 링크를 걸어서 사용하시면 됩니다.
http://sunga.da.to/home/say.js
제목 | 글쓴이 | 날짜 |
---|---|---|
타이머 | *이종민* | 2008.11.29 |
즐겨찾기 추가 소스 | *이종민* | 2008.11.29 |
F5 방지 | *이종민* | 2008.11.29 |
펌방지(펌방제해제우회) [13] | *이종민* | 2008.11.29 |
팁이라고 할 수 없는 [이미지안투명박스] [2] | 엔시™ | 2007.12.23 |
css 간단한 박스 레이아웃입니다. [8] | stryper | 2007.11.21 |
[초간단 팁] 글씨에 음영효과를 주는 태그 [2] | 이유 | 2007.05.02 |
문법적으로 이상이 없는데 빈틈이 생길 때...해결 방법 [5] | 이명우 | 2006.12.16 |
셀렉트박스 트리메뉴인데 참 이뻐요(링크타켓 - new/blank) [8] | 뽀因㉦ㅓо Ø Γ | 2006.09.19 |
게임차트에서 가져오는 실시간 게임순위 [2] | 絶世美男@ | 2005.12.11 |
필터 효과들 [1] | keymove | 2005.07.08 |
스킨작업에 중요하게 쓰이는 것들 [2] | ProSense™ | 2005.04.12 |
XE 어플 개발시 키보드위에 입력창 올리기 [4] | 웹빌드 | 2014.03.11 |
폰갭 처리시 뒤로가기 종료 처리 방법 | 웹빌드 | 2014.03.11 |
board.js 안의 ret_obj 로 추가변수 받아오기 [10] | KS | 2013.12.20 |
게시판에 대해 닉네임,이름 등의 정렬을 추가하는 방법 [1] | sejin7940 | 2014.03.09 |
사이트접속시 모바일기기 접속이면 설정한 페이지로 이동시키기 | 홈피닥터 | 2014.03.09 |
홈페이지 주소창 상세 링크 안보이게 설정 | 헤이즈디자인 | 2014.03.09 |
유동아이피로 고정아이피 만들수있는 유틸 [27] | 론건맨 | 2003.10.10 |
xp어플 개발시 사진 회원 바로잡아 주는 함수 | 웹빌드 | 2014.03.09 |
드림위버에선 쉽게 하던데;;;ㅡㅜ 머가 다른거죠?????? ;ㅁ;