Question

我正在寻找一种在视口中激活CSS3动画的解决方案，而无需更改容器的类。有什么建议吗？

我所做的是使用animate.css类包装元素的wordpress短代码

function bounce( $atts, $content = null ) {  
    return '<div class="animated bounce">'.do_shortcode($content).'</div>';  
}  
add_shortcode("Bounce", "bounce");

function flash( $atts, $content = null ) {  
    return '<div class="animated flash">'.do_shortcode($content).'</div>';  
}  
add_shortcode("Flash", "flash");

这将输出

<div class="animated bounce">My Content</div>

或

<div class="animated flash">My Content</div>

现在我只希望动画在视口中启动。但是当我将其添加为短代码时，我不知道要添加＆＃34;动画弹跳的父元素的类＆＃34;当它进入视口并且由于客户可以在主题中的任何位置使用此短代码，它也可以是网站上多个区域的同一个类。所以它确实需要寻找单个元素，而不是元素类。

我想我必须在视口中加载短代码，而不是动画。但我不知道怎么做。请记住：同一个短代码在一个页面上可能是10次，但是这10个短代码中的每一个都应该只在它们现在可见的情况下进行拍摄。

希望您了解我的问题并提供解决方案。提前谢谢！

在视口中启动短代码

0 个答案: