我想在我的投资组合网站上创建一个数字计数器动画。我的旧网站中有一些 jquery 代码，当完全加载时，它们会从预加载器转换到网站。
<script> $(window).on('load', () => { $('#preloader').fadeOut(1800, function() { $(this).remove(); }); }); </script>
如何添加数字计数器动画并添加侧面向上过渡？ 谢谢
给你。
slideUp
div
删除
示例：
$(window).on('load', () => { let count = 3; function ShowCounter() { if (count > 0) { $("#spnNumber").fadeOut('slow', function() { $("#spnNumber").text(count); $("#spnNumber").fadeIn(); count--; }); } else if (count == 0) { $("#preloader").slideUp(); $("#spnNumber").remove(); clearInterval(interval); } } var interval = setInterval(function() { ShowCounter() }, 1000) });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id='preloader'>Loading ... </div> <span id='spnNumber'><span>
给你。
slideUp您的div和删除计数器跨度。示例：
$(window).on('load', () => { let count = 3; function ShowCounter() { if (count > 0) { $("#spnNumber").fadeOut('slow', function() { $("#spnNumber").text(count); $("#spnNumber").fadeIn(); count--; }); } else if (count == 0) { $("#preloader").slideUp(); $("#spnNumber").remove(); clearInterval(interval); } } var interval = setInterval(function() { ShowCounter() }, 1000) });