一款基于css3和jquery实现的动画显示弹出层按钮教程

2020-05-09 06:59:32易采站长站整理

            <img src="128.jpg" alt="" />  
        </div>  
        <!– Face 2 –>  
        <div class="papersheet__face-item animated fadeInUp">  
            <img src="129.jpg" alt="" />  
        </div>  
        <!– Face 2 –>  
        <div class="papersheet__face-item animated fadeInUp">  
            <img src="130.jpg" alt="" />  
        </div>  
    </div>  
    <script src=’jquery.js’></script>  
    <script>  
        _papersheet = $(‘.papersheet’);   
        _trigger = $(‘.papersheet__trigger’);   
        _trigger.click(function () {   
            if (_papersheet.hasClass(‘opened’)) {   
                $(this).parent(‘.papersheet’).stop().removeClass(‘opened’);   
            } else {   
                $(this).parent(‘.papersheet’).stop().addClass(‘opened’);   
            }   
        });   
        //@ sourceURL=pen.js   
    </script>  

  css3代码:

CSS Code复制内容到剪贴板

@import url("http://daneden.github.io/animate.css/animate.min.css");   
        :root   
        {