javascript - 如何做 3 个 jQuery 回调

标签 javascript jquery css callback

我想要按顺序执行三个函数。首先放大一个物体,然后旋转360度,最后调整到放大前的大小。我可以做第一个和第二个,但我不知道如何做最后一个。

如何使用 jQuery 回调来完成此操作?谁能给我一个工作结构?我是 jQuery 的新手。

这是我目前所拥有的:

<html>
    <head>  
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
        <script>
            $(document).ready(function() {
                $('#abc').click(function () {
                    $(this).animate({               
                        width: '+=90px',
                        height: '+=90px',
                        fontSize: '300%'
                    }, function(){
                        $(this).toggleClass('rotate');
                    });             
                   // add function -- resize to normal
                });
            });
        </script>
        <style>
            .rotate {       
                transition: all 0.7s;
                -webkit-transform: rotate(6.28rad);
                -ms-transform: rotate(6.28rad);
                transform: rotate(6.28rad); 
            }
        </style>

    </head>

    <body>  
        <div id="abc" style="border:1px solid;width:90px;">HTML / CSS</div>
    </body>

</html>

最佳答案

这是我为您创建的实际链接 https://jsfiddle.net/beljems/t83xmj8h/ .我修改了你的代码:)

我使用 CSS 关键帧 为 div 元素设置动画,并向 jquery 添加了 setTimeout 函数,我估计了正常工作的时间:)

关于javascript - 如何做 3 个 jQuery 回调,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45808371/

相关文章:

javascript - 如何模拟 AWS sqs 调用进行单元测试

javascript - 使用 jquery 从复选框中获取标签值

javascript - 在 Meteor 中遍历数组时如何获取模板详细信息

html - float CSS后Div崩溃

javascript - 如何在 div 上显示所有控制台消息?

asp.net - 我想使用 Javascript 将项目添加到 ASP.Net 组合框

javascript - 从公共(public) Instagram 主题标签获取图像

JavaScript改变页面效果

javascript - 自动完成 "is not a function"

jquery - 当全屏模式打开时,如何在 Youtube Iframe 上添加覆盖 div?