给网站添加一言打字效果

最近看到一个静态的主页,页面首页有个一言打字效果

给网站添加一言打字效果

这种效果其实很简单 教程如下:

将下面代码放到 </body>标签前。

如果页面已经加载了jquery

<script src="//ku.dzzui.com/js/jquery.min.js"></script> 
<script type="text/javascript" src="//ku.dzzui.com/js/typed.min.js"></script>
<script>
   $.ajax({
            type:"get",
            url:"https://api.dzzui.com/api/yiyan?format=json2",
            async:true,
          
     success:function(typed){
            var list = [];
            for(var i = 0 ;i < typed.data.length ; i++){
                list.push(typed.data[i]['text']);
            }
                $("#typed").typed({
                    strings: list,
                    typeSpeed: 20,
                    loop: true,
                    backDelay: 1000,
                });
            }
        });
    </script>

然后在你要显示一言打字的地方加入下面代码

<span id="typed">Loading</span>

还有一个非常简单的,一行代码,但是没有打字特效

直接放在要显示的地方,只需这一行代码

<script src="//api.dzzui.com/api/yiyan?format=js"></script>

 

温馨提示:本文最后更新于2022-09-17 22:13:50,某些文章具有时效性,若有错误或已失效,请在下方留言或联系丁塔克博客
© 版权声明
THE END
喜欢就支持一下吧
点赞8打赏 分享
评论 抢沙发

请登录后发表评论