https://youtu.be/9Rtx8pDNaJ8

예제 다운로드: https://goo.gl/fW5PM5

[ 고정헤더 고급  ]
- 내용 복사, 추가, 이동
- 스크롤 부담 줄이기
- 내용의 높이

 

반응형

https://youtu.be/6XGofYERoC8

예제 다운로드: https://goo.gl/Q85HQ8

[ 헤더 고정하기 ]
 - 스크롤양 파악하기
 - 상단에서부터 요소까지의 거리 확인하기

 

반응형

https://youtu.be/xSOW5LnulFU

jQuery 13 [ Slideshow 고급 4/4] 인디케이터 활성화 표시하기, 자동으로 움직이는 슬라이드 구현하기

Sample Download: https://goo.gl/QMGPgR
(please check jquery 10th footage)

1/5 번째 예제: https://goo.gl/QMGPgR 에서 이어서 시청해주세요.

[ 고급 슬라이드구현하기 파트 4/4 ]
- 인디케이터 활성화 표시하기, 
 - 자동으로 움직이는 슬라이드 구현하기
- setinterval


Code Editor: Notepad++
http://alikerock.tistory.com/
Twitter: #eztoweb
https://github.com/alikerock/ezweb

#jquery, #slideshow, #디자인, #웹퍼블리셔, #프론트엔드, #웹디자인기능사

 

반응형

https://youtu.be/4TZOCYBJ4Dw

1/4 번째 예제: https://goo.gl/QMGPgR 에서 이어서 시청해주세요.

Sample Download: https://goo.gl/QMGPgR
(please check jquery 10th footage)


[ 고급 슬라이드구현하기 파트 3/4 ]
- 인디케이터로 슬라이드 이동하기
- 좌우 버튼으로 슬라이드 이동하기
- hasClass, index()

Code Editor: Notepad++
http://alikerock.tistory.com/
Twitter: #eztoweb
https://github.com/alikerock/ezweb

#jquery, #slideshow, #디자인, #웹퍼블리셔, #프론트엔드, #웹디자인기능사

 

반응형

https://youtu.be/gyTogVzkOFA

1/4 번째 예제: https://goo.gl/QMGPgR 에서 이어서 시청해야 합니다.

Sample Download: https://goo.gl/QMGPgR
(please check jquery 10th footage)

[ 고급 슬라이드구현하기 파트 2/4]
- 변수 지정하기
- 슬라이드 배치하기
- pager 생성하기

Code Editor: Notepad++
http://alikerock.tistory.com/
Twitter: #eztoweb
https://github.com/alikerock/ezweb

#jquery, #slideshow, #디자인, #웹퍼블리셔, #프론트엔드, #웹디자인기능사

 

반응형

https://youtu.be/ykIkTMVBwWg

기본예제: https://goo.gl/QMGPgR

[ 고급 슬라이드구현하기 파트 1/4 ]
- HTML,CSS 작성하기
- 슬라이드 구조작성하기
- CSS 스타일 설정하기
- FLEX, POSITION


노트패드에 젠코딩 설치하기 링크 추가
https://youtu.be/JAWDbgoL-MY

스프라이트 이미지 위치 잡기 링크 추가
https://youtu.be/n98axuhWWrU

플렉스로 위치 잡기 영사 링크 추가
https://youtu.be/_PSy66fkQ7U



에디터: notepad++
티스토리 : http://alikerock.tistory.com/
트위터: #eztoweb

#jquery, #slideshow, #디자인, #웹퍼블리셔, #프론트엔드, #웹디자인기능사

반응형

https://youtu.be/kAr_JIuQjzU

Sample Download:  https://goo.gl/gFf9vE

- Normalize CSS
- Modernizr
- setInterval
- fadeIn, fadeOut
- eq

에디터: notepad++
티스토리 : http://alikerock.tistory.com/
트위터: #eztoweb

#jquery, #slideshow, #디자인, #웹퍼블리셔, #프론트엔드, #웹디자인기능사

반응형

https://youtu.be/dPt643ZYdjU

Sample Download:  https://goo.gl/A2nWDM

- Class 관련 메서드
- toggleClass
- Attr
- cubic bezier
- jQuery 성능향상

에디터: notepad++
티스토리 : http://alikerock.tistory.com/
트위터: #eztoweb

#jquery, #toggleClass, #디자인, #웹퍼블리셔, #프론트엔드, #웹디자인기능사

 

반응형

https://youtu.be/IqZgcXYRNmw

Sample Download:  https://goo.gl/ZBCqYY

jQuery 응용
- javascript & jquery 비교
- each 메서드
- animate 메서드
- find, filter

Code Editor: Notepad++
http://alikerock.tistory.com/
Twitter: #eztoweb
https://github.com/alikerock/ezweb

#jquery, #each, #디자인, #웹퍼블리셔, #프론트엔드, #웹디자인기능사

반응형

동영상보기: https://youtu.be/E4Vih_rpwaM

 

Sample Download:  https://goo.gl/TnwJH1

jQuery 응용
- find, filter
- animate 메서드 활용

Code Editor: Notepad++
http://alikerock.tistory.com/
Twitter: #eztoweb
https://github.com/alikerock/ezweb

#jquery, #animate, #이벤트, #디자인, #웹퍼블리셔, #프론트엔드, #웹디자인기능사

 

반응형

+ Recent posts