<script>
//체크박스의 체크된 갯수 확인
//체크박스의 존재 여부 확인
function onlyNumberInput()
{
var code = window.event.keyCode;
if ((code > 34 && code < 41) || (code > 47 && code < 58) || (code > 95 && code < 106) || code == 8 || code == 9 || code == 13 || code == 46)
{
window.event.returnValue = true;
return;
}
window.event.returnValue = false;
}
이때, 텍스트 필드에 아래의 Style을 붙여주면 허용하는 아스키 코드값의 키만 입력가능하게 셋팅할 수 있다.
<input type = "text" name ="isbn" id="isbn" value="" maxlength="13" onKeyDown = "javascript:onlyNumberInput()" style='IME-MODE: disabled' />
//코드 업그레이드
// IE외의 브라우저에서도 동작할 수 있도록 변경
function onlyNumberInput2( Ev ){
if (window.event) // IE코드
var code = window.event.keyCode;
else // 타브라우저
var code = Ev.which;
if ((code > 34 && code < 41) || (code > 47 && code < 58) || (code > 95 && code < 106) || code == 8 || code == 9 || code == 13 || code == 46)
{
window.event.returnValue = true;
return;
}
if (window.event)
window.event.returnValue = false;
else
Ev.preventDefault();
}
<input type = "text" name ="isbn" id="isbn" value="" maxlength="13" onKeyDown = "javascript:onlyNumberInput(event)" style='IME-MODE: disabled' />
function getexcel(sex)
{
var k=0
if (document.frmOpenMarket.gserial.length==undefined) // 한개일 경우..
{
if (document.frmOpenMarket.gserial.checked==true) {
k++;
}
}
else // 여러개일경우
{
for(i=0;i<document.frmOpenMarket.gserial.length;i++)
{
if (document.frmOpenMarket.gserial[i].checked)
{
k++;
}
}
}
if (k==0)
{
alert("상품을 선택해주세요.");
}
else
{
if (confirm("선택하신 상품을 엑셀로 다운로드 하시겠습니까?"))
{
document.frmOpenMarket.action="make_excel.asp?sex=" + sex
document.frmOpenMarket.submit();
}
}
}
<script>
function bt(id,after)
{
eval(id+'.filters.blendTrans.stop();');
eval(id+'.filters.blendTrans.Apply();');
eval(id+'.src="'+after+'";');
eval(id+'.filters.blendTrans.Play();');
}
</script>
위 스크립트 소스를 적용하시고
아래와같이 링크 소스를 적용하세요
<a href="링크경로" onMouseOver='bt("img1","B이미지경로")' onMouseOut='bt("img1","A이미지경로")'><img id="img1" src="A이미지경로" width="가로폭" height="세로폭" border="0" style="filter:blendTrans(duration=1.0)" onfocus="this.blur()"></a>
<a href="링크경로" onMouseOver='bt("img2","B이미지경로")' onMouseOut='bt("img2","A이미지경로")'><img id="img2" src="A이미지경로" width="가로폭" height="세로폭" border="0" style="filter:blendTrans(duration=1.0)" onfocus="this.blur()"></a>
각 메뉴의 링크 소스마다 id 를 img1 , img2 처럼 다르게 지정해 주시고
필터(스르륵) 효과의 강도는 필요하시면 duration=1.0 에서 수치를 0.5 등으로 조절하시면 됩니다
-출처 : 지식인-
적용해본 코드
<form name="frmSub">
<tr>
<td width="10"> </td>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img name="subimg" id="subimg" src="img/conimg_17.gif" width="333" height="240" style="filter:blendTrans(duration=0.4)"/></td>
</tr>
<tr>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="40" colspan="2">
<!-- 썸네일 시작 -->
<table width="100%" border="0" cellpadding="5" cellspacing="0">
<tr>
<td align="left"><img src="img/conimg_17.gif" name="sumimg1" width="70" height="70" id="sumimg1" onmouseover='bt("document.frmSub.subimg",this.src)' style="cursor:pointer;cursor:hand;" /></td>
<td align="center"><img src="img/conimg_17.gif" name="sumimg2" width="70" height="70" id="sumimg2" onmouseover='bt("document.frmSub.subimg",this.src)' style="cursor:pointer;cursor:hand;" /></td>
<td align="center"><img src="img/conimg_17.gif" name="sumimg3" width="70" height="70" id="sumimg3" onmouseover='bt("document.frmSub.subimg",this.src)' style="cursor:pointer;cursor:hand;" /></td>
<td align="right"><img src="img/conimg_17.gif" name="sumimg4" width="70" height="70" id="sumimg4" onmouseover='bt("document.frmSub.subimg",this.src)' style="cursor:pointer;cursor:hand;" /></td>
</tr>
</table>
/*◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆*/
/*
Input값 형식
url : 연결할 페이지("/OnlineSvc/Prviate/main.aps?action=view")
Width : 브라우저의 너비 숫자만 입력하세요(500=>○, '500'=>X,"500"=>X)
Height : 브라우저의 높이 숫자만 입력하세요(500=>○, '500'=>X,"500"=>X)
Center : 브라우저의 가운데 여부 true or false
Toolbar : 브라우저의 툴바 표시여부 yes or no
Resizable : 브라우저의 사이즈 조정 가능여부 yes or no
Scrollbars : 브라우저의 스크롤바 표시여부 yes or no
Left : 브라우저의 왼쪽 위치 숫자만 입력하세요(10=>○, '10'=>X,"10"=>X)
Top : 브라우저의 윗쪽 위치 숫자만 입력하세요(10=>○, '10'=>X,"10"=>X)
*/
//openWin:PopUp창을 띄우는 함수로 툴바,사이즈변화,스크롤바 없는 창입니다.)
function openWin(url,Width,Height,Center) {
if (Center==true){
window.open(url, "", "toolbar=no,resizable=no,scrollbars=no,width=" + Width + ",height=" + Height + ",left=" + (window.screen.width/2-Width) + ",top=" + (window.screen.height/2-Height));
}
else {
window.open(url, "", "toolbar=no,resizable=no,scrollbars=no,width=" + Width + ",height=" + Height + ",left=0,top=0");
}
}
//openWin_All:PopUp창을 띄우는 함수로 툴바,사이즈변화,스크롤바 포함하는 창입니다.)
function openWin_All(url,Width,Height,Center) {
if (Center==true){
window.open(url, "", "toolbar=yes,resizable=yes,scrollbars=yes,width=" + Width + ",height=" + Height + ",left=" + (window.screen.width/2-Width) + ",top=" + (window.screen.height/2-Height));
}
else {
window.open(url, "", "toolbar=yes,resizable=yes,scrollbars=yes,width=" + Width + ",height=" + Height + ",left=0,top=0");
}
}
//openWin_Toolbar:PopUp창을 띄우는 함수로 툴바만 창입니다.)
function openWin_Toolbar(url,Width,Height,Center) {
if (Center==true){
window.open(url, "", "toolbar=yes,resizable=no,scrollbars=no,width=" + Width + ",height=" + Height + ",left=" + (window.screen.width/2-Width) + ",top=" + (window.screen.height/2-Height));
}
else {
window.open(url, "", "toolbar=yes,resizable=no,scrollbars=no,width=" + Width + ",height=" + Height + ",left=0,top=0");
}
}
//openWin_Resizable:PopUp창을 띄우는 함수로 사이즈를 변경가능한 창입니다.)
function openWin_Resizable(url,Width,Height,Center) {
if (Center==true){
window.open(url, "", "toolbar=no,resizable=yes,scrollbars=no,width=" + Width + ",height=" + Height + ",left=" + (window.screen.width/2-Width) + ",top=" + (window.screen.height/2-Height));
}
else {
window.open(url, "", "toolbar=no,resizable=yes,scrollbars=no,width=" + Width + ",height=" + Height + ",left=0,top=0");
}
}
//openWin_Scrollbars:PopUp창을 띄우는 함수로 스크롤바가 있는 창입니다.)
function openWin_Scrollbars(url,Width,Height,Center) {
if (Center==true){
window.open(url, "", "toolbar=no,resizable=no,scrollbars=yes,width=" + Width + ",height=" + Height + ",left=" + (window.screen.width/2-Width) + ",top=" + (window.screen.height/2-Height));
}
else {
window.open(url, "", "toolbar=no,resizable=no,scrollbars=yes,width=" + Width + ",height=" + Height + ",left=0,top=0");
}
}
//openWin_Scrollbars:PopUp창을 띄우는 함수로 스크롤바가 있는 창입니다.)
function openWin_R_S(url,Width,Height,Center) {
if (Center==true){
window.open(url, "", "toolbar=no,resizable=yes,scrollbars=yes,width=" + Width + ",height=" + Height + ",left=" + (window.screen.width/2-Width) + ",top=" + (window.screen.height/2-Height));
}
else {
window.open(url, "", "toolbar=no,resizable=yes,scrollbars=yes,width=" + Width + ",height=" + Height + ",left=0,top=0");
}
}
//openWin_Scrollbars:PopUp창을 띄우는 함수로 툴바,사이즈변화,스크롤바등을 모든 값을 정의하는 창입니다.)
function openWin_definition(url,Center,Toolbar,Resizable,Scrollbars,Width,Height,Left,Top) {
window.open(url, "", "toolbar=" + Toolbar+ ",resizable=" + Resizable + ",scrollbars=" + Scrollbars + ",width=" + Width + ",height=" + Height + ",left=" + Left + ",top=" + Top);
}
//-->
input박스가 한개인 폼에서는 엔터를 치면 스크립트가 실행안되고 그냥 엑션으로 submit된다
이를 막기위해 폼엑션에 스크립트를 넣는다
<form action="javascript
토들러몰의 검색input박스의 예다
이러면 엔터를 처도 검색버튼을 눌러도 내용을 넣으라는 스크립드가(search()) 실행된다
text 박스의 readonly 값 역시 true/false로 자바스크립트에서 제어가 가능합니다.
단, readonly를 전부소문자로 사용하면 적용되지 않는다는 것 주의하세요!!
<script>
document.FormX.name.readOnly = false;
</script>
<script>
/************************** 080118 레이어 이동 소스 추가 _ 손지곤 ****************************************/
var TnTL_clickTime;
function DragResize_DN(it_Resize,evt,div_id){
if(div_id){
mv_act_objt=document.getElementById(div_id);
if(mv_act_objt.style.position!='absolute'){
mv_act_objt.style.left=TnT_get_objLeft(mv_act_objt);
mv_act_objt.style.top=TnT_get_objTop(mv_act_objt);
mv_act_objt.style.position='absolute';
}
mv_act_objt.style.zIndex=++iwinzidx;
}
else{mv_act_objt=iwindowLAYER;}
DragResize_start=1;
Drg_x=(this_browser=='n')? evt.pageX : event.clientX;
Drg_y=(this_browser=='n')? evt.pageY : event.clientY;
if(it_Resize<1){// Drag
temp1=parseInt(mv_act_objt.style.left);
temp2=parseInt(mv_act_objt.style.top);
if(this_browser=='n') document.onmousemove=TnTmoveAct_n;
else document.onmousemove=TnTmoveAct;
}
else{// Resize
iwindoWidth=parseInt(TntiwindowTable.width); // 가로
iwindoHeight=parseInt(TntiwindowTable.height); // 세로
if(this_browser=='n') document.onmousemove=TnTresizeAct_n;
else document.onmousemove=TnTresizeAct;
}
TnTL_clickTime=1;
}
function TnTmoveAct(){ // drag
if(DragResize_start==1){
mv_act_objt.style.left=temp1+event.clientX-Drg_x;
mv_act_objt.style.top=temp2+event.clientY-Drg_y;
return false;
}
}
// resize move
function TnTresizeAct(){
if(DragResize_start==1){
var re_x=iwindoWidth+event.clientX-Drg_x;
var re_y=iwindoHeight+event.clientY-Drg_y;
if(re_x<50 || re_y<50) return false;
iwindow_RESIZE(re_x,re_y);
return false;
}
}
// 부라우저 바탕화면 클릭시 레이어 자동으로 닫히게함(지워 버려도 됨) ----------------------
document.onclick=iwindow_CLOSE_AUTO;
function iwindow_CLOSE_AUTO(){
DragResize_start=0;
if(TnTL_clickTime==1) return; // iwindow 를 드래그 ro 크기변경 동작후에는 자동닫기 적용안함(무조건 자동닫기 적용하려면 이 라인을 삭제)
if(this_browser=='e'){
if (event.srcElement.className=="TnT_Layer_dragin") return; // iwindow: Drag, Resize
if (event.srcElement.className=="TnT_Top_button") return; // iwindow : TopButton
if (event.srcElement.className=="TnT_Editor_button") return; // editor : Button
}
if((TnTL_clickTime+500)<(new Date()).getTime()){iwindow_CLOSE();}
}
function TnTmoveAct_n(evt){ // drag
if (DragResize_start==1){
mv_act_objt.style.left=temp1+evt.pageX-Drg_x;
mv_act_objt.style.top=temp2+evt.pageY-Drg_y;
return false;
}
}
// resize move
function TnTresizeAct_n(evt){
if (DragResize_start==1){
var re_x=iwindoWidth+evt.pageX-Drg_x;
var re_y=iwindoHeight+evt.pageY-Drg_y;
if(re_x<50 || re_y<50) return false;
iwindow_RESIZE(re_x,re_y);
return false;
}
}
// thisobj 의 Top
function TnT_get_objTop(thisobj){
if (thisobj.offsetParent==document.body) return thisobj.offsetTop;
else return thisobj.offsetTop + TnT_get_objTop(thisobj.offsetParent);
}
// thisobj 의 Left
function TnT_get_objLeft(thisobj){
if (thisobj.offsetParent==document.body) return thisobj.offsetLeft;
else return thisobj.offsetLeft + TnT_get_objLeft(thisobj.offsetParent);
}
// onload 기본모드
mouseDN_X=0;
mouseDN_Y=0;
if(navigator.userAgent.indexOf('MSIE') == -1){
this_browser='n';
document.onmousedown=function(n_evt){
mouseDN_X=n_evt.pageX;
mouseDN_Y=n_evt.pageY;
}
it_img_tag='input type=image '; // iwindow title
}
else{
this_browser='e';
it_img_tag='img ';
}
iwinzidx=10;
tntactiwin='';
/************************** //080118 레이어 이동 소스 추가 _ 손지곤 ****************************************/
</script>
<span style="position:relative;">
<div id="strm_hdd_layer" style="width:420px; position:absolute; top:19px; left:22px; display:'';">
<table width="100%" cellpadding="0" cellspacing="0">
<tr height="29">
<td><img src="http://img.cafe24.com/images/hosting/popup/common/box_left_081.gif" align="absmiddle"></td>
<td width="100%" style="background:url(http://img.cafe24.com/images/hosting/popup/common/box_bg_081.gif) repeat-x; padding:5px 0 0 2px; color:#ffffff;" onmousedown="DragResize_DN(0,event,'strm_hdd_layer')">
<b>하드(HDD) 용량이란?</b>
</td>
<td style="background:url(http://img.cafe24.com/images/hosting/popup/common/box_bg_081.gif) repeat-x;">
<img src="http://img.cafe24.com/images/hosting/popup/common/x_081_off.gif" align="absmiddle" style="cursor:hand;" onmouseover="this.src='http://img.cafe24.com/images/hosting/popup/common/x_081_on.gif';" onmouseout="this.src='http://img.cafe24.com/images/hosting/popup/common/x_081_off.gif'" onclick="strm_hdd_layer.style.display='none';">
</td>
<td><img src="http://img.cafe24.com/images/hosting/popup/common/box_right_081.gif" align="absmiddle"></td>
</tr>
</table>
<table width="100%" cellpadding="0" cellspacing="0" style="border:1px #aaaaaa solid; border-top:none;" bgcolor="#f6f6f6" >
<tr>
<td style="padding:8px;">
<table width="100%" cellpadding="0" cellspacing="0" bgcolor="#ffffff">
<tr>
<td><img src="http://img.cafe24.com/images/hosting/popup/common/box_left_top_081.gif" align="absmiddle"></td>
<td width="100%" style="background:url(http://img.cafe24.com/images/hosting/popup/common/box_line_081.gif) top repeat-x;"></td>
<td><img src="http://img.cafe24.com/images/hosting/popup/common/box_right_top_081.gif" align="absmiddle"></td>
</tr>
<tr>
<td style="background:url(http://img.cafe24.com/images/hosting/popup/common/box_line_081.gif) left repeat-y;"></td>
<td width="100%" style="color:#555555; line-height:1.4em;">
<!-- 실 내용 -->
하드 용량이란 FTP를 이용해 스트리밍CDN 서비스에 업로드가 가능한 자료의 용량입니다.<br><br>
용량이 모두 사용된 경우에는 추가옵션 및 사양 변경으로 증설이 가능하며, 신청은 [나의서비스관리]에서 하실 수 있습니다.
<!-- //실 내용 -->
</td>
<td style="background:url(http://img.cafe24.com/images/hosting/popup/common/box_line_081.gif) right repeat-y;"></td>
</tr>
<tr>
<td><img src="http://img.cafe24.com/images/hosting/popup/common/box_left_btm_081.gif" align="absmiddle"></td>
<td width="100%" style="background:url(http://img.cafe24.com/images/hosting/popup/common/box_line_081.gif) bottom repeat-x;"></td>
<td><img src="http://img.cafe24.com/images/hosting/popup/common/box_right_btm_081.gif" align="absmiddle"></td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</span>
http://www.cafe24.com/streaming/cdn_streaming_spec.php
이곳에서 사용된 소스코드임
function showplatformrow()
{
if (SearchForm.ItemType.selectedIndex == 1)
{ document.getElementById('ProductRow').style.display = 'block'; }
else
{
SearchForm.Platform.selectedIndex = 0;
document.getElementById('ProductRow').style.display = 'none';
}
}
<input name=test onKeyUp="inputNumCheck()" style='IME-MODE: disabled'> 1 byte 언어권과 2 byte 언어권과의 차이로 인해서
style="word-wrap:break-word;word-break:break-all"
두가지를 한꺼번에 사용해준다.
<script language='javascript'>
function h_check(Objectname)
{
var intErr
var strValue = Objectname
// var strValue = Objectname.value
var retCode = 0
for (i = 0; i < strValue.length; i++)
{
var retCode = strValue.charCodeAt(i)
var retChar = strValue.substr(i,1).toUpperCase()
retCode = parseInt(retCode)
if ((retChar < "0" || retChar > "9") && (retChar < "A" || retChar > "Z") && ((retCode > 255) || (retCode < 0)))
{
intErr = -1;
break;
}
}
return (intErr);
}
</script>
<script>
var h;
h = h_check(searchform.txtSearchParam.value)
if( h == -1) // 한글
{
alert("ID에 한글이나 특수 문자가 있습니다. \n\n회원 ID는 반드시 영문,숫자의 조합으로 4-12자리내에서 입력하십시오. ");
searchform.txtSearchParam.focus();
return;
}
</script>