|
제작자 링크 및 데모 |
제작자 링크..
jQuery TwentyTwenty Plugin | Playground from ZURB
Already have a ZURB ID? Log in
zurb.com
|
Code |
<head>
<!-- JS 파일을 첨부하고 -->
<script src="./images/jquery.event.move.js"></script>
<script src="./images/jquery.twentytwenty.js"></script>
<!-- 함수 호출 -->
<script>
$(document).ready(function(){
$("#comparison_slider").twentytwenty();
$("#comparison_slider[data-orientation='vertical']").twentytwenty({default_offset_pct: 0.3, orientation: 'vertical'});
})
</script>
<style>
/* 레이어 사이즈는 이미지 사이즈와 동일하게 설정 */
#comparison_slider { width: 1000px; height: 667px; margin: auto }
.
.
.
.
.
</style>
</haed>
<body>
<div id="comparison_slider">
<img src="before.jpg">
<img src="after.jpg">
</div>
<div id="comparison_slider" data-orientation="vertical">
<img src="before.jpg">
<img src="after.jpg">
</div>
</body>
|
다운로드 |
Comparison Slider (Jquery).rar
38.6 kB
