Blog Content

폰트사이즈 확장 및 축소 컨텐츠 본문에서 폰트 사이즈 확장 및 축소 jQuery 12345678910111213141516171819var maxNum = 24; // 폰트 사이즈 var nimNum = 14; // 폰트 사이즈 $('.box-zoom .btn-zoomin').on('click', function () { // console.log(uiSize + 2) var ui_font = $(".box-news-body").css("font-size") var uiSize = Number(ui_font.replace(/[^0-9]/g,'')); if (uiSize nimNum) $('.box-news-body').css({'font-size': '-=2'}); }); 12345678910111213..

jQuery 갤러리 리스트 플러그인 모음 사이트 https://www.jqueryscript.net/gallery/

PARALLAX - PLUGINhttp://vegas.jaysalvat.com/documentation/transitions/

슬라이더를 사용할때 bxslider도 있고 slick도 있고 한데..이번에 써보면서 느낀건데 .. 이녀석이 가장 괜찮은듯모바일에서 여러가지 슬라이더 들이 있긴 한데 이녀석이 가장 쓸만한것 같다. http://idangero.us/swiper/

플러그인http://leafo.net/sticky-kit/#examples 참고 http://bong8nim.com/post/programming/javascript/sticky-sidebar-jquery-plugin-sticky-kit-js/

vs code 마켓플레이스 VS Code 마켓 플레이스 유용한 설치파일 auto-close-tagauto-rename-tag code-settings-syncfilenamecompletehtml-css-class-completionlocal-history beautify - HTML 파일을 정리해준다 (전체선택 후 문서서식누르면 정리된다.)

jQuery 퀵 버튼 01. CSS 12345678910* {margin:0; padding:0; font-size:14px;}a, a:active {color:#333; text-decoration:none;}ul li {list-style:none;}header {height:100px; background:orchid}section {height:1500px; background:burlywood}footer {height:100px; background:darkcyan}body { position:relative; }.quick {position:fixed; bottom:20px; right:20px; display:none;}.quick.on {display:block; }.quick a {di..

스크롤 따라다니는 메뉴 01. CSS 123456789/* CSS 는 입맛에 맞게 변경 */html, body {height: 100%;}#wrap {text-align:center; height:100%}header {background:orange; box-shadow: 0px 5px 10px -5px; position:relative;}header li {display:inline-block;}header li a {display:block; padding:20px;}header.fixd {position:fixed; top:0; width: calc(100% - 15px);} section {background:orchid; min-height:100%; padding:150px 0 150px}f..

텝 Animate 드롭 메뉴 01. CSS 123456789101112.tab_type02 ul:after {content:""; display: block; clear:both;}.tab_type02 li {float:left;/* width:25%;*/}.tab_type02 li a{display:block; padding:10px; border:1px solid #ccc; text-align:center;}.tab_type02 li.on a{background:#ccc; color:#fff; }.tab_type02 .box_area { position: relative;}.tab_type02 .box {border:1px solid #ccc; border-top:0; width:100%; paddi..

텝 메뉴 Animate 01. CSS 123456789101112.tab_type03 .box_area, .tab_type03 ul.menu:after {content:""; display: block; clear:both;}.tab_type03 .menu li {float:left;/* width:25%;*/}.tab_type03 .menu li a{display:block; padding:10px; border:1px solid #ccc; text-align:center;}.tab_type03 .menu li.on a{background:#ccc; color:#fff;}.tab_type03 .box_area {width:100%; height:100px; overflow:hidden;}.tab_typ..