자바스크립트2008. 10. 22. 08:59

자바스크립트로 스타일시트 변경하기

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> <meta http-equiv="Content-Type" content="text/html; charset=euc-kr"> <style> #a {border:10 solid cyan;font-weight:blod;font-size:25px} .b {background-color:#FF9999} </style> <SCRIPT LANGUAGE="JavaScript"> <!-- function modify_style(selector,property,value) { var styleSheet = document.styleSheets; var changed = false; if(!styleSheet.length) { var newStyle = document.createElement("style"); newStyle.type = "text/css"; document.getElementsByTagName("head")[0].appendChild(newStyle); } if(!property) property = "cssText"; for(var i=0, style_len=styleSheet.length ; i<style_len ; i++) { var rule = styleSheet[i].cssRules?styleSheet[i].cssRules:styleSheet[i].rules; for(var j=0, rule_len=rule.length ; j<rule_len ; j++) { if(rule[j].selectorText.toLowerCase() == selector.toLowerCase()) { rule[j].style[property] = value; changed = true; } } } if(!changed) { var style = document.styleSheets[0]; if(property == "cssText") var cssText = value; else var cssText = property + ":" + value; if(style.insertRule) style.insertRule(selector+"{"+cssText+"}",style.cssRules.length); else if(style.addRule) style.addRule(selector,cssText); else return false; } } //modify_style("#a","border","1px solid #fcc"); //modify_style(".b",0,"width:500px ; height:300px"); //--> </SCRIPT> </HEAD> <BODY> <A HREF="#1" id="a" class="b">이런기능은 언제 사용할라나..^^</A><br /> <br /> <INPUT TYPE="button" NAME="" value="modify_style('#a','border','1px solid #fcc');" onclick="modify_style('#a','border','1px solid #fcc');"><br /> <br /> <INPUT TYPE="button" NAME="" value="modify_style('.b',0,'width:500px ; height:300px');" onclick="modify_style('.b',0,'width:500px ; height:300px');"> </BODY> </HTML>
Posted by 아마데우스
자바스크립트2008. 10. 22. 08:58

IE6에서 png(투명) 이미지 제대로 처리하기

<script language="javascript"> <!-- function setPng24(obj) { obj.width=obj.height=1; obj.className=obj.className.replace(/\bpng24b/\i,''); obj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+ obj.src +"',sizingMethod='image');"; obj.src=''; return ''; } //--> </script> <style type="text/css"> .png24 { tmp:expression(setPng24(this)); } </style> <body style='background-color:red'> <img src='333.png' class='png24'> <img src='333.png'> <div style="margin:0; padding:0; border:none; background:none; float:none; clear:none; z-index:0"></div> <script type="text/javascript" src="https://tistory1.daumcdn.net/tistory_admin/userblog/userblog-9f215d513ac1c1fc530f1b625c346be762e46741/static/script/common.js"></script> <script type="text/javascript">window.roosevelt_params_queue = window.roosevelt_params_queue || [{channel_id: 'dk', channel_label: '{tistory}'}]</script> <script type="text/javascript" src="//t1.daumcdn.net/midas/rt/dk_bt/roosevelt_dk_bt.js" async="async"></script> <script>window.tiara = {"svcDomain":"user.tistory.com","section":"기타","trackPage":"글뷰_보기","page":"글뷰","key":"267594","customProps":{"userId":"0","blogId":"267594","entryId":"null","role":"guest","trackPage":"글뷰_보기","filterTarget":false},"entry":null,"kakaoAppKey":"3e6ddd834b023f24221217e370daed18","appUserId":"null"}</script> <script type="module" src="https://t1.daumcdn.net/tistory_admin/frontend/tiara/v1.0.5/index.js"></script> <script src="https://t1.daumcdn.net/tistory_admin/frontend/tiara/v1.0.5/polyfills-legacy.js" nomodule="true" defer="true"></script> <script src="https://t1.daumcdn.net/tistory_admin/frontend/tiara/v1.0.5/index-legacy.js" nomodule="true" defer="true"></script> </body>
Posted by 아마데우스
자바스크립트2008. 10. 22. 08:55

애초에 숫자만 입력되게 하기 (다른 문자는 노 노 노)

function onlyNumber(){ if((event.keyCode<48)||(event.keyCode>57)) event.returnValue=false; } <input type='text' onkeypress=onlyNumber()>
Posted by 아마데우스
자바스크립트2008. 10. 11. 22:58

이미지 토글, 현재 주소

<!--StartFragment-->// 이미지 토글
<script>
function gogo(obj,opt)
{
var surl = 'http://' + document.location['host'];
obj.src = (obj.src == surl + '/images/img'+opt+'_on.gif') ? surl + '/images/img'+opt+'_off.gif': surl + '/images/img'+opt+'_on.gif';
}
</script>
<img src=images/img1_on.gif onclick=gogo(this,1)>
<img src=images/img2_on.gif onclick=gogo(this,2)>
<img src=images/img2_on.gif onclick=gogo(this,3)>
<img src=images/img2_on.gif onclick=gogo(this,4)>
<img src=images/img2_on.gif onclick=gogo(this,5)>

저작자표시 비영리 변경금지
Posted by 아마데우스

티스토리툴바