Blog Content

  • jQuery 폐쇄형 슬라이드

    Category 개발연습막쓰기/jQuery on 2018. 9. 18. 21:06

    jQuery 슬라이드 웹사이트에서 제이쿼리를 이용한 슬라이드폐쇄형으로 작업되었다. 즉, 이전, 다음 이미지가 보이지 않는 오로지 중앙에 이미지가 나올때 적합한 소스이다.오픈된 슬라이드 메뉴가 아닌 폐쇄형 슬라이드다. 실행된 이미지 이전 다음 0000 1111 2222 3333 .wrap {width:400px; margin:0 auto; } .wrap .sliderWrap {width:400px; height:200px;overflow:hidden;} .wrap .slider:after {display:block; content:""; clear:both;} .wrap .slider {height:100%; width:1600px; position:relative;} .wrap .box {float:le..

    Read more
  • jQuery 실행 파일의 위치

    Category 개발연습막쓰기/jQuery on 2018. 9. 3. 20:41

    script 파일을 문서 하단에 배치하는 이유 스크립트 파일을 head에 혹은 body맨 하단에 배치 하는 이유 : 하단 이미지 참고 하단에 실행문을 보면 제이쿼리에서 제공하는 동일한 문법이다. 문장을 해석하면 Document가 준비가 되면 실행을 하라는 문구이다. 이 문장은 상단의 이미지에서 상단 배치에 해당하는 부분으로말 그대로 문서가 준비가 되면 스크립트를 실행 하라는 말이 된다. $(function(){ // 실행문 }); $(document).ready(function(){ // 실행문 }); 그렇다면 하단에 배치 할 경우 하단의 문법으로 코딩이 가능한 형태가 된다.이 말은 상단의 문법도 가능하지만, Document가 로딩이 되면서 순차적으로 스크립트의 영역에 도달했을때 실행을 하게된다.(fun..

    Read more
  • 드롭 ANIMATE 텝

    Category 개발연습막쓰기/개발연습 막쓰기 on 2017. 7. 17. 18:45

    텝 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..

    Read more