如何通过API代码触发Polymer纸波纹动画? [英] How to trigger Polymer paper ripple animation by API code?
本文介绍了如何通过API代码触发Polymer纸波纹动画?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我尝试在 https://elements.polymer-project.org中描述的$.find("paper-ripple").animate(); /elements/paper-ripple ，但这不起作用.
I tried $.find("paper-ripple").animate(); described at https://elements.polymer-project.org/elements/paper-ripple but this does not work.
推荐答案
您可以使用simulatedRipple()波纹纸的方法.
You can use simulatedRipple() method of paper-ripple.
<!DOCTYPE html>
<html>
<head>
<base href="https://polygit.org">
<script src="/components/webcomponentsjs/webcomponents-lite.min.js"></script>
<link rel="import" href="/components/polymer/polymer.html">
<link rel="import" href="/components/paper-ripple/paper-ripple.html">
<style>
.card {
position: relative;
display: inline-block;
width: 300px;
height: 240px;
vertical-align: top;
background-color: #fff;
box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.24);
}
</style>
</head>
<body>
<template id="demo" is="dom-bind">
<div class="card">
<paper-ripple recenters></paper-ripple>
</div>
</template>
</body>
<script>
var demo = document.querySelector('#demo');
demo.addEventListener('dom-change', function() {
setInterval(triggerRipple, 1000);
});
triggerRipple = function() {
var paperRipple = document.querySelector('paper-ripple');
paperRipple.simulatedRipple();
}
</script>
</html>
这篇关于如何通过API代码触发Polymer纸波纹动画?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
