글

2017의 게시물 표시

[jQuery] 페럴럭스 기초 - 2 : translateZ

<style type="text/css"> *{padding:0;margin:0;list-style:none;} /*body{height:14000px;}*/ #wrap{overflow:hidden;overflow-y:scroll;} .menu{position:fixed;top:30px;left:30px;z-index:100;} .menu ul li.on a{font-size:20px;color:#000;font-weight:bold;} .container{position:fixed;width:100%;height:100%;left:0;top:0;z-index:1;} .scrollBox{width:100%; height:100%; position:absolute; top:0px; left:0px; opacity:0.3; z-index:1;font-size:100px; color:#fff;text-align:center;} /*.scrollBox:nth-child(1){transform: translateZ(0px)} .scrollBox:nth-child(2){transform: translateZ(-1069px)} .scrollBox:nth-child(3){transform: translateZ(-6000px)} .scrollBox:nth-child(4){transform: translateZ(-9000px)}*/ .scrollBox.on{z-index:10;opacity:0.8;} .bgColor01{background:#ff9900;} .bgColor02{background:#0000ff} .bgColor03{background:#cc0033} .bgColor04{background:#808080} </style> <div id="wrap"> <div class="menu"> <ul> <li
댓글 쓰기
자세한 내용 보기

[jQuery] 페럴럭스 기초

<style type="text/css"> *{margin:0;padding:0;list-style:none;} html,body{height:100%;font-size:14px/1.5} .wrap{height:100%;} .menu{position:fixed;top:30px;left:30px;} .menu li.on a{font-weight:bold;color:#fff;} .btmLine{position:fixed;left:0;top:0;width:100%;height:10px;background:#999;} .btmLine span{display:block;width:0%;height:10px;background:#000;} .wrap div:nth-child(1){background:#ffcc00} .wrap div:nth-child(2){background:#0066cc} .wrap div:nth-child(3){background:#cc3366} .wrap div:nth-child(4){background:#66cc66} .scrollBox{font-size:50px;color:#fff;text-align:center;} .scrollBox.on{font-size:100px;color:#000;} </style> <div class="wrap"> <div class="scrollBox on" id="scrollBox01">1</div> <div class="scrollBox" id="scrollBox02">2</div> <div class="scrollBox" id="scrollBox03">3</div> <div class="scrollBox" i
댓글 쓰기
자세한 내용 보기

[jQuery] 체크박스 전체 선택

$(document).ready(function(){ $("#check-all").on("click", function(){         if($("#check-all").prop("checked")){             $("input[name=check-type]").prop("checked",true);         }else{             $("input[name=check-type]").prop("checked",false);         }     }); $("input[name=check-type]").on("click", function(){ if($(this).is(":checked") == false){ $("#check-all").prop("checked",false) } }); });
댓글 쓰기
자세한 내용 보기

[JS] 문항 합계 구하기 - 배열

<div> <table id="question"> <tr> <th>1번 문항</th> <td><input type="radio" name="question1" id="qone1" value="1" /></td> <td><input type="radio" name="question1" id="qone2" value="2" /></td> <td><input type="radio" name="question1" id="qone3" value="3" /></td> <td><input type="radio" name="question1" id="qone4" value="4" /></td> </tr> <tr> <th>2번 문항</th> <td><input type="radio" name="question2" id="qtwo1" value="1" /></td> <td><input type="radio" name="question2" id="qtwo2" value="2" /></td> <td><input type="radio" name
댓글 쓰기
자세한 내용 보기

[JS] 금액 콤마

//콤마찍기 function  comma(str) {     str  =   String (str);      return  str.replace( / (\d)(? = (?:\d{ 3 }) + (? ! \d)) / g,  '$1,' ); }   //콤마풀기 function  uncomma(str) {     str  =   String (str);      return  str.replace( / [^\d] + / g,  '' ); }   //값 입력시 콤마찍기 function  inputNumberFormat(obj) {     obj.value  =  comma(uncomma(obj.value)); }   //<input type="text" onkeyup="inputNumberFormat(this)" /> 출처 : http://dlevelb.tistory.com/829
댓글 쓰기
자세한 내용 보기

[JS] 금액 콤마

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="ko"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <script src="http://code.jquery.com/jquery-1.9.1.js"></script> <style type="text/css"> *{margin:0;padding:0;} </style> </head> <body> <div class="set po1"> <input type="text" name="item01" id="item01" readonly="readonly" value="1" /> <a href="#" class="btn_act1">+</a> <a href="#" class="btn_act2">-</a> </div> <div class="set po2"> <input type="text" name="item02" id=&qu
댓글 쓰기
자세한 내용 보기

[JS] 오늘 하루 그만 보기 레이어(+윈도우창)

1) - CSS a{text-decoration:none; color:white} .pull-right{float:right} .main_popup{width:350px; height:430px; border:3px solid #3E4156;background-color: white;} .popup_bottom{     background-color: #3E4156;     color: white;     height: 25px;     padding: 2px 10px 3px 10px;     width:330px; } - JS if(getCookie("notToday")!="Y"){ $("#main_popup").show('fade'); } function closePopupNotToday(){           setCookie('notToday','Y', 1); $("#main_popup").hide('fade'); } function setCookie(name, value, expiredays) { var today = new Date();    today.setDate(today.getDate() + expiredays);    document.cookie = name + '=' + escape(value) + '; path=/; expires=' + today.toGMTString() + ';' } function getCookie(name) {     var cName = name + "=";     var x = 0;     while ( x <= document.cookie.length )     {         var y = (x+cName.length);    
댓글 쓰기
자세한 내용 보기

[JS] 브라우저 체크

var Browser = {      chk : navigator.userAgent.toLowerCase() }     Browser = {      ie : Browser.chk.indexOf( 'msie' ) != -1,      ie6 : Browser.chk.indexOf( 'msie 6' ) != -1,      ie7 : Browser.chk.indexOf( 'msie 7' ) != -1,      ie8 : Browser.chk.indexOf( 'msie 8' ) != -1,      ie9 : Browser.chk.indexOf( 'msie 9' ) != -1,      ie10 : Browser.chk.indexOf( 'msie 10' ) != -1,      opera : !!window.opera,      safari : Browser.chk.indexOf( 'safari' ) != -1,      safari3 : Browser.chk.indexOf( 'applewebkir/5' ) != -1,      mac : Browser.chk.indexOf( 'mac' ) != -1,      chrome : Browser.chk.indexOf( 'chrome' ) != -1,      firefox : Browser.chk.indexOf( 'firefox' ) != -1 }     if ((Browser.ie9) || (Browser.ie10)) {      // 브라우저가 IE9, 10일 때 실행할 코드 } else if (Browser.chrome) {      // chrome } else if (Browser.firefox) {      // fierfox } else {    
댓글 쓰기
자세한 내용 보기