有没有办法只在图像的不透明度为1时单击？

Question

我有一个形象,是可以点击的,其与开始opacity的0和动画播放至1当的被盘旋其上.有没有办法只在动画完成后点击它并且opacity它在1？

Answer 1

我相信你正在寻找这样的东西:

$(document).ready(function() {
    $('img').on('mouseover', function() {
        $(this).fadeTo( 3000 , 1 );
    });
    $('img').on('click', function(e) {
        e.preventDefault();
        if($(this).css('opacity') == 1) {
            alert('you can click it now');
        }
    });
});

img {
    opacity: 0;    
}
div{
    display: inline-block;
    border: 1px solid black;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
    <img src="https://s-media-cache-ak0.pinimg.com/736x/2f/cc/b2/2fccb29f96bf7f0b0ea94d42832a4c4f.jpg"/>
</div>

该函数.on('click')阻止了最初使用e.preventDefault()代码行单击图像的任何默认操作.然后检查图像的不透明度是否正确1,然后您可以将代码放在那里,以便在不透明度时执行您想要的任何操作1.

希望这可以帮助!