jQuery Plug-in innerFade

2021. 12. 20. 11:03Study/Example & Plug-in

jQuery Plug-in innerFade

 

 

inner fade ex.zip
0.13MB

 

<!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