jQuery Plug-in innerFade
2021. 12. 20. 11:03ㆍStudy/Example & Plug-in
jQuery Plug-in innerFade
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
*{ margin:0px; padding:0px; }
ul{list-style:none;}
img{ width:400px; height:220px; border:0;}
</style>
<script src="js/jquery-1.7.1.min.js"></script>
<script src="js/jquery.innerfade.js"></script>
<script>
// JavaScript Document
$(document).ready(function () {
// innerfade 플러그인을 적용합니다.
$('.inner_fade').innerfade({
animationtype: 'fade',
speed: 'slow',
timeout: 2000,
type: 'sequence',
containerheight: '220px'
});
});
</script>
</head>
<body>
<ul class="inner_fade">
<li><img src="images/img1.jpg" alt="img1"/></li>
<li><img src="images/img2.jpg" alt="img2"/></li>
<li><img src="images/img3.jpg" alt="img3"/></li>
<li><img src="images/img4.jpg" alt="img4"/></li>
<li><img src="images/img5.jpg" alt="img5"/></li>
</ul>
<ul class="inner_fade">
<li>Box Shadow and Text Shadow</li>
<li>Transparency with RGBA and Opacity</li>
<li>Custom Web Fonts with @Font-Face</li>
</ul>
</body>
</html>
'Study > Example & Plug-in' 카테고리의 다른 글
jQuery Plug-in move_banner (0) | 2021.12.20 |
---|---|
jQuery plug-in s3slider (0) | 2021.12.20 |
jQuery Plug-in FancyBox (0) | 2021.12.20 |
jQuery Plug-in LightBox (0) | 2021.12.20 |
form 이름,패스워드 검사 (0) | 2021.12.03 |