예제6 [Wordpress] 워드프레스 테마(Theme)용 하단(footer) 고정시키는 CSS 템플릿 샘플 예제 워드프레스용 하단(Footer) 고정 템플릿 샘플예제입니다. 워드프레스 테마(Theme)를 만들 때 유용합니다. 2018. 12. 21. [Bootstrap] 부트스트랩 토글 버튼 - 클릭시 서로 색상이 바뀌는 예제 샘플 See the Pen bootstrap toggle button - color change by Woojin Choi (@woojin-choi) on CodePen. 클릭시 버튼 색상이 서로 바뀌는 예제입니다. 단순히 active 클래스만 변경되는 게 아님. 2018. 12. 17. [Bootstrap] CSS만 사용해서 하단(footer) 고정 레이어 샘플 예제 (부트스트랩용 샘플) See the Pen bottom fix footer - bootstrap by Woojin Choi (@woojin-choi) on CodePen. 하단 고정 레이어 여러가지 방법이 있는데요. 부트스트랩으로 템플릿을 만들어야해서 부트스트랩 class를 사용해서 만들어 봐야겠습니다. 부트스트랩의 기능으로 하단을 고정시킨 건 아닙니다. CSS로만 화면 하단에 고정시켰습니다. 2018. 12. 13. [jQuery] 제이쿼리로 전체선택/선택해제 간단하게 구현해 보는 예제입니다. function checkAllFunc(obj) { $("[name=chk]").each(function() { this.checked = obj.checked; }) } 체크박스가 [name=chk]로 이름이 같기 때문에 each()문으로 루프를 돌리며 작업을 합니다. this.checked = obj.checked; => 전체선택 체크박스가 선택되면 다른 체크박스도 체크하고, 전체선택 체크박스가 선택해제되면 다른 체크박스도 선택해제하는 명령입니다. 전체선택 onclick="checkAllFunc(this)" => 전체선택의 체크박스를 클릭할 때 checkAllFunc ()함수를 실행해 달라는 명령입니다. 2014. 12. 5. [jQuery] 글자 폰트 사이즈 늘리고 줄이기, 숨기고 보이기, 애니메이션으로 버튼 크기 조절하는 예제 먼저, 아래 링크를 클릭해서 이전 예제를 참조하세요. 2014/12/03 - [프로그래밍 언어/jQuery] - 글자 폰트 사이즈 늘리고 줄이기 예제 2014/12/03 - [프로그래밍 언어/jQuery] - 글자 폰트 사이즈 늘리고 줄이기, 숨기고 보이기 예제 $("div.label").click(function() { $("div.button") .fadeTo("slow", 0.5) .animate({width:400}, "slow") .fadeTo("slow", 1.0) .animate({height:38}, "slow"); });$("div.button") 은 을 찾는 selecter 입니다. fadeTo() 로 서서히 나타나는 효과를 구현했구요. animate() 으로 버튼의 너비와 높이가 늘어.. 2014. 12. 3. [jQuery] 리스트 항목에 레벨 단위로 스타일 입히기 (UL, LI 태그) .horizontal { float: left; /* 좌측 정렬 */ list-style: none; /* 목록 앞의 글머리 기호 표시를 제거한다. */ margin: 10px; /* 요소의 모든 가장자리에 10 픽셀의 여백을 준다. } 스타일시트에 horizontal 클래스를 정의합니다. $(document).ready(function() { $("#selected-plays > li").addClass("horizontal"); }); DOM이 로드되고 이미지가 로드되기 전에 $(document).read() 함수가 실행됩니다. selected-plays를 ID값으로 가지는 요소에 horizontal 클래스를 적용하라는 명령입니다. 2014. 12. 3. 이전 1 다음
