Question

所以我遇到的问题是我似乎无法让我的jQuery函数添加一个类来启动我的动画？我已经尝试了很多不同的方法来使它工作，它们都没有工作！

的jQuery

$(document).ready(function(){
    window.onload = function render(){
    $('.title .sub-title').addClass('render');
}
});

CSS

.render {
    animation-name: render;
    animation-duration: 2s;
    animation-timing-function: ease-in-out;
}

@keyframes render {
    0% { transform: translateX(-800px); }
    100% { transform: translateX( 0px ); }
}

HTML 的

<div class="site-header-title-wrapper">
    <h1 class="title">Template 1</h1><!--Need To add animation 
    <h4 class="sub-title">- Here is a Template Slogan -</h4><!--Need To add animation to-->
</div>

请有人帮忙吗？

这将非常有益！

Answer 1

尝试以下方法：

$(document).ready(function(){
  $('.title, .sub-title').addClass('render');
});

示例中的代码定位于嵌套在.sub-title元素中的.title元素。在CSS选择器中包含逗号应解决此问题。

Answer 2

您的.sub-title课程已被注释掉。试试这个：

<div class="site-header-title-wrapper">
    <h1 class="title">Template 1</h1>
    <h4 class="sub-title">- Here is a Template Slogan -</h4>
</div>

我无法使用jquery

2 个答案: