分享学习记录
互联网技术知识

WordPress首页文章列表浮出的代码教程

CSS代码:

/*列表依次进入*/
posts{display: none}.fadeIn{display: block; animation: fadeIn 3s;}@keyframes fadeIn{0%{opacity: 0; transform: translate3d(0, 50px, 0);} 100%{opacity: 1; transform: translate3d(0, 0, 0);}}

JS代码:

// 列表依次进入
let lis = $('posts');
Array.from(lis).forEach((item, index) => {
    setTimeout(() => {
        $(item).addClass('fadeIn');
    }, 150 * index);
});

两个都要添加,效果可自行测试。

赞(0)
文章名称:《WordPress首页文章列表浮出的代码教程》
文章链接:https://www.bailuze.com/8499.html
本站所有文章,如无特殊说明或标注,均为本站原创发布。任何在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。
本站专注于百度、搜狗、360、谷歌、bing等常见搜索引擎的优化,关键词排名的提高,诚意咨询邮箱526009505@qq.com
分享到