selectbox와 쿠키 사용하기 with jquery 셀렉트 박스에서 선택한 값으로 타겟의 옵션이 바뀌어지고 브라우저를 새로고침하거나 껐다가 켜도 쿠키로 유지하고 싶을때 setCookie와 getCookie 함수로 만들어서 구워내는 놈, 쿠끼꺼내는 놈 만들기 function setCookie(cName, cValue, expiredays) { var today = new Date(); today.setDate( today.getDate() + expiredays ); document.cookie = cName + "=" + escape( cValue ) + "; path=/; expires=" + today.toGMTString() + ";" } function getCookie() { // useri..
요약(Summary)CSS의 transform 속성을 사용함으로써, CSS의 시각적 서식 모델(visual formatting model)의 좌표 공간을 변형시킬 수 있다. 해당 속성에 지정된 값에 따라 엘리먼트(element)에 이동(translate), 회전(rotate), 크기변경(scale), 기울임(skew)등의 효과를 줄 수 있다. 만약, none이 아닌 값이 설정된 경우, stacking context 가 생성된다. 이 경우, 해당 객체는 position: fixed 인 엘리먼트(element)를 포함하는 컨테이너(containg block)처럼 동작한다.초기값 noneApplies to any transformable element상속 noMedia visualComputed value ?..
CSS3 스펙 꾸러미의 일부인 CSS 트랜지션(transitions)은 CSS 속성을 변경할 때 애니메이션 속도를 조절하는 방법을 제공합니다. 속성 변경이 즉시 영향을 미치게 하는 대신, 그 속성의 변화가 일정 기간에 걸쳐 일어나도록 할 수 있습니다. 예를 들어, 여러분이 어떤 요소의 색상을 흰색에서 검은색으로 변경한다면, 변화는 대개 즉시 일어납니다. CSS 트랜지션을 이용하면, 모두 커스터마이즈 가능한 어떤 가속도 곡선을 따르는 시간 주기마다 변화가 일어납니다.두 상태 사이의 트랜지션을 포함하는 애니메이션을 종종 암묵적 트랜지션이라고 부르는데, 이는 시작과 종료 상태 사이의 상태를 브라우저가 암묵적으로 정의하기 때문입니다.CSS transitions는 여러분이 (명시적으로 목록을 작성해서) 어떤 속성..
웹폰트 - 나눔고딕 웹폰트로 "나눔고딕, 나눔고딕 볼드, 나눔 고딕 엑스트라 볼드" 를 항상 사용하기 때문에 common.css 같은 파일에 항상 정의해서 쓰지만 폰트 적용 부분만 필요한 경우가 있기 때문에 부분적으로 포스팅 소스코드 (css + 폰트 포함) 다운로드 @charset "utf-8"; /* * Nanum Gothic (Korean) http://www.google.com/fonts/earlyaccess * @import url(http://fonts.googleapis.com/earlyaccess/nanummyeongjo.css); * @import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css); */ @font-face { f..
accordion menu css3 + jquery source : http://designmodo.com/ 예제보기 (실행가능) 소스코드 html + jquery My Files495 01Dropbox42 02Skydrive87 03FTP Server366 04Dropbox1 05Skydrive10 Mail26 01Hotmail9 02Yahoo14 Cloud58 01Connect12 02Profiles19 03Options27 04Connect12 05Profiles19 06Options27 Sign Out 01Log Out 02Delete Account 03Freeze Account By Valeriu Timbuc for DesignModo. css3 /* ************************..
룰렛게임 자바스크립트 (with. 제이쿼리, jqueryrotate library) ※ 경고. 연구용도를 제외한 소스와 결과물의 '상업적 이용'을 절대 금합니다. 수정 : 2015.06.18 직접 ccs3의 속성을 이용하여 구현할 수도 있겠지만, 브라우저의 가장 큰 문제는 호환성이기에.. 이것저것 두루두루 따져보았을 때 아래의 jqueryrotate plugin은 이러한 문제를 간편하게 해결해주며 사용법 또한 직관적이다. 이 플러그인을 가지고 degree를 계산하여 룰렛을 만들어보았다. https://code.google.com/p/jqueryrotate/ http://beneposto.pl/jqueryrotate/ This is a small plugin for jQuery that adds a nic..
DIV의 수평정렬 div안에 포함되어 있는 텍스트를 수평중앙정렬 하기 위해서는 text-align: center; 스타일을 지정해 준다. div안에 포함되어 있는 display가 block인 요소들을 수평중앙정렬 하기 위해서는 다음과 같이 margin좌우에 auto로 지정해 준다. margin:0 auto 0; margin:0 auto; margin-left:auto; margin-right:auto; DIV의 세로 정렬 Table 엘리먼트에서 vertical-align: middle; 로 수직중앙정렬 했지만 div에서는 적용 되지 않는다. 우리는 div의 display를 직접 table속성으로 확장,변경해 주고 수직으로 정렬하는 방법을 알아보겠다. 가로 세로 센터 DIV나 TABLE 등 고전적인 방법(..
CSS를 사용하여 재미있는 텍스트 효과를 추가하는 방법 Internet Explorer 10에서는 text-shadow CSS(CSS 스타일시트) 속성을 사용하여 하드웨어 가속 텍스트 그림자를 지원합니다.text-shadow 속성에 대한 지원은 웹 개발자가 가장 많이 요청하는 기능 중 하나였습니다. 이 속성을 사용하면 인라인 텍스트 이미지를 사용하지 않고도 이전에 어렵거나 불가능했던 텍스트 효과를 구현할 수 있습니다. CSS 텍스트 그림자는 W3C(World Wide Web 컨소시엄)의 CSS 텍스트 수준 3 사양의 10.3절에 정의되어 있습니다. Internet Explorer 10의 웹 페이지 이외에도 JavaScript를 사용하는 Windows 스토어 앱도 또한 text-shadow 속성을 지원합니..
HTML Table을 엑셀로 저장하기 : Export to excel sheet on client side 1. 엘리먼트의 download 속성을 이용하여 저장하기. 2. 엘리먼트의 download속성과 URL에 data타입을 사용하기, 엑셀 파일 이름 지정하기. 3. jquery.battatech.excelexport 라이브러리를 사용하기. 4. jquery.battatech.excelexport 라이브러리를 사용하여 파일이름 지정하기. 5. jquery.battatech.excelexport 라이브러리를 사용하여 파일이름 지정하기2. 1. 엘리먼트의 download 속성을 이용하여 저장하기. [ code ] No Title Type Author URL 1 SAP : Study And Programmi..
여러분들 블로그나 웹사이트 를 관리하실때 대표적으로 구글 애드센스 광고를 달아서 수익을 창출을 많이 하시는 가운데 가끔 부정클릭으로 인해 경고나 아애 계정이 영구정지가 되는 경우가 적지 않아 사례가 많아 이래 저래 걱정에 앞서 항상 늘 신경을 써줘야 하는 점이 있는 점이 있습니다. 하지만 이때 애드센스 수익을 실시간으로 확인이 가능하고 실수 부정 클릭을 방지 하는 구글 퍼블리셔 툴바(Google Publisher Toolbar) 크롬 확장 프로그램을 소개하고자 합니다. 이 프로그램은 크롬의 부가기능으로 말그대로 애드센스 수익을 실시간으로 확인할 수 있지만 채널별 광고 단위 별로 상세하게 볼 수 있고 부정 클릭을 방지 할 수 있는 기능이 있어 애드센스 사용자에겐 매우 반가운 프로그램 으로 없어선 안될 존재..