我需要播放CSS动画的每一次股票属性的项目状态重新呈现(增加按钮点击)
反应代码：
const RenderingApp = () => {
const [items, setItems] = useState([
{ fruit: 'banana', stock: 10, id: 0 },
{ fruit: 'apple', stock: 5, id: 1 },
]);
const renderList = () => {
return items.map((item, index) => {
浏览 1提问于2021-08-11得票数 1
回答已采纳
我创建了一个按钮来显示文本“复制！”每次用户点击“复制”按钮。我完成这一任务的方法是将动画分配给相关的标记，并使用setTimeout“重置”动画。这样，当用户第二次或第三次单击按钮时，动画就会再次播放。
但是，我确信这不是一个理想的解决方案，因为如果用户在setTimeout完成之前单击，按钮会“中断”直到2500 is通过。在那之后，它又起作用了。
我如何重构CSS/JS，使“复制！”每次单击按钮时都会显示消息？(不因超时而受到限制/延迟)
const copyURL = () => {
const copyDiv = document.querySelector(&
浏览 3提问于2019-09-29得票数 3
回答已采纳
我想做一个网页，其中有2个buttons...On点击按钮1，"loading.gif“播放和点击按钮2，它停止，但图像仍然显示。我希望这些活动具有CPU效率，也就是说，它们应该消耗更少的CPU周期。
到目前为止我尝试过的方法：
我从"loading.gif“中捕获了一个静止图像，在单击按钮2时，我将img.src属性更改为"still.gif”。
我使用在线工具将"loading.gif“划分为单独的框架。在单击按钮1时，我手动调用框架，计时器设置为100毫秒(即手动完成动画)。并且，在单击按钮2时，我使用clearTimeout()清除了计时器。
浏览 2提问于2016-08-03得票数 1
1回答
当用户单击按钮时，我想在我的页面上显示一个动画gif。我已经用img标记在页面上放置了gif，并给标签设置了不透明的CSS样式:0，这样页面加载后图像就不会播放了：
HTML
<img id='thankyou' src='http://www.mysite.com/images/thankyou.gif' />
CSS
img#thankyou {
opacity:0;
}
按钮代码是：
$('.submitButton').click(function() {
$('img#thankyou')
浏览 5提问于2013-10-10得票数 0
回答已采纳
2回答
我有一个带有动画的FBX对象。该对象是一个带有动画的打开框。我要做的是，当用户单击一个按钮时，该框将打开(播放打开的动画)，当再次单击该按钮时，该框将关闭(向后播放打开的动画)。
当打开的动画正在播放，我再次单击按钮，打开动画停止和框开始关闭，这是很好的工作。问题是，当动画完成(打开)，然后我点击按钮关闭，动画没有播放，它只是跳到一个封闭的框没有动画。
这是我的代码：
public class ClickBtn : MonoBehaviour {
public GameObject box = null;
bool reverse = false;
private
浏览 4提问于2014-08-17得票数 2
回答已采纳
所以..。我有一个h1和一个按钮。我希望在单击使用CSS的按钮时，将使用h1创建的动画添加到JQuery中。
单击该按钮时，动画应该向h1添加更多内容。当我单击按钮时，我希望它启动，但它一加载HTML就会启动。
由于我是新手，我无法理解其他复杂的答案。请帮帮我。
这是HTML
<div class="container-fluid center" id="mainPage">
<div id="heading" class="row">
<h1 id="wishH1&#
浏览 1提问于2021-06-15得票数 0
回答已采纳
1回答
我想在动画UI元素时播放一些声音效果(例如，在UI对象移动时播放移动声音)，这需要精确的定时和同步。
我真的无法从中的描述中找出我应该使用的框架。所以我需要你帮我选一个。
我想做的是：
播放短(最多10秒)的声音效果(例如按钮点击声音)。
能够与UI动画同步(例如视图外观/消失)。
我尝试使用AudioServicesPlaySystemSound框架中的AudioToolbox函数，有时效果很好，但有时声音不会立即播放。例如，当单击按钮时，它的操作在播放声音之前执行，即使在按钮的操作方法中首先调用AudioServicesPlaySystemSound。
提前谢谢你，
莫塔
浏览 4提问于2011-11-15得票数 3
回答已采纳
可以在另一个组件上调用方法吗？
我已经创建了需要在单击时或在发生特定事件时进行切换的。
例如，我创建了一个React组件，其功能相当于媒体播放器上的播放按钮。我使用LottieJS和bodymovin来制作SVG按钮的动画。如果歌曲正在播放，按钮会显示暂停符号。如果歌曲停止播放，则会显示播放符号。
这是我的PlayButton组件...
import React from 'react';
import Lottie from 'react-lottie';
import PropTypes from 'prop-types';
import s
浏览 3提问于2018-03-06得票数 0
1回答
在加载了Facebook之后，我的CSS动画在IE11中崩溃了。
下面是一个测试用例：
单击该按钮会在其上切换一个类，该类通过CSS动画稍微旋转按钮。5秒后，Facebook被加载。在火狐浏览器、Chrome和IE10上，这个按钮在此之后继续工作，但在IE11上，当添加类时，动画就不再播放了。
我不能在JSFiddle中复制这个问题。
知道是什么导致的吗？无论是IE11还是Facebook的SDK都有问题，但我需要找到解决办法。
这很可能与看起来非常相似的有关。
浏览 1提问于2014-07-03得票数 0
回答已采纳
我很难获得CSS转换(将div缩放到1.05，它的原始大小)，以便在下面的页面上与jQuery动画一起很好地播放：
当您在一个彩色div上悬停时，您可以看到CSS的转换，单击Email Us按钮会触发一个动画，但是动画被剪短了。
我已经确认，删除CSS动画允许jQuery动画正确显示。
我已经确定了两个行动方案：
从我的样式表中删除CSS转换并使用jQuery重新创建效果。当使用将触发动画的链接时，将删除CSS转换。。
我认为第一个选择是更好的两个，因为它允许动画复位到零，然后才被拿走。但我对更好的想法持开放态度，因此在这里发布了这个小问题。
谢谢您能提供的任何帮助。
浏览 3提问于2012-05-20得票数 1
回答已采纳
现在，我可以在页面上显示CSS3动画(而不是全屏动画)。 当动画播放时，我想禁用所有的按钮和输入。 动画完成后，然后启用所有的按钮和输入。 我如何才能做到这一点？我不想在每个空格中添加一个布尔值"IsEnabled“来实现这一点。 谢谢。
浏览 58提问于2020-07-28得票数 0
回答已采纳
我想在加载元素的innerHTML时播放一些动画，下面是我的代码：
function loadslide(){
...
$('.m').html($('.bigSlider div:nth-child(1)').html()).fadeIn("slow");
}
$('.rightarrow').click(function(event){
event.preventDefault();
loadslide();
});
但当我单击按钮时，没有显示动画。
浏览 0提问于2015-09-22得票数 0
回答已采纳
在我的应用程序中，我想要播放gif图像，我可以播放gif图像，但我想处理gif图像，例如，如果我单击开始按钮动画应该开始，如果单击停止按钮动画应该停止。
strtbtn.setOnClickListener(this);
public void onClick(View v) {
// TODO Auto-generated method stub
Canvas canvas=new Canvas(mBitmap);
long now = android.os.SystemClock.uptimeMillis();
浏览 8提问于2012-09-13得票数 2
4回答
CSS结束动画？
、、
因此，当类被加载时，我可以很容易地制作一个动画，如下所示： @keyframes dropin {
from {top: -100px;}
to {top: 0;}
}
.menu {
display: none;
animation: dropin .4s;
} 因此，当我单击一个按钮时，javascript就会执行，并将display:none属性更改为block，然后它就会播放fadein动画。 然而。当它变回display: none时，就没有动画了。在css中有解决这个问题的方法吗？如果不是，我怎么做呢？
浏览 28提问于2017-03-13得票数 0
回答已采纳
3回答
我有一个带有视频播放器的web应用程序。当用户按下按钮时，视频开始播放。现在，我添加了一个动画，当点击按钮时开始播放，当它完成时，视频应该开始播放。动画基于setInterval (更准确地说，是HTML5的变体requestInterval)。
这很好用，但只能在Mac/PC上运行，因为Android上的视频播放有限制。当您希望视频真正开始以编程方式播放时，调用video元素的play()函数的函数需要由用户操作(例如，单击按钮)直接触发。
在动画之前，情况确实如此，一切都按预期进行。我需要在动画结束后才播放视频，因为如果视频在动画开始时开始播放，动画会有相当大的延迟。
有什么想法或变通办法
浏览 2提问于2014-09-12得票数 0
1回答
这里有一个播放彩色动画的链接
甚至我需要某种淡入和淡出彩色动画与jQuery。我希望当用户单击一个按钮时，我的div会像堆栈溢出一样淡出。
我试过这样做，但我想我的效果接近堆叠溢出，但不一样。下面是我用CSS尝试过的代码
$(window).bind( 'hashchange', function( event ){
var hash = '#'+event.fragment;
var originalcolor = $(hash).css('background-color');
$(hash)
浏览 3提问于2015-06-10得票数 2
回答已采纳
我正在尝试使用‘react-native-app- to slider’来处理Lottie动画。
它运行良好，但当我单击“上一步”或“下一步”按钮时，动画停止播放。
如何重新播放动画？
提前感谢！
const renderItem = ({ item }) => {
return (
<View style={styles.container}>
<LottieView
ref={LottieRef}
autoPlay
loop
source={item.lottie}
浏览 43提问于2021-02-13得票数 0
1回答
使用CSS和Javascript (最好不是jQuery，因为我也不明白)，我如何设置动画从暂停状态到播放状态触发，当用户单击文本链接(href)，而不是按钮？
浏览 5提问于2015-09-28得票数 3
回答已采纳
2回答
我有四个按钮来选择数字的范围。(点击的按钮应该是动画和保持缩放，以指示哪个按钮被选中)，我正在尝试播放动画按钮点击统一。因此，当单击按钮时，动画就会播放并返回到空闲状态。但是，我不希望它返回到空闲状态，而是希望它保持在单击动画剪辑的最后一个帧(最后一个帧缩放为1.2)。循环时间未被检查。我已经在检查器中指定了onclick动画播放(字符串)。请帮助也尝试了以下代码
public GameObject rangeBtn;
public Animator rangeBtnAnim;
private void Start()
{
if ((rangeBtn != null) &
浏览 0提问于2019-03-20得票数 0
回答已采纳
我正在尝试使用display: none隐藏一个div，然后使用jQuery通过单击一个按钮从切换fadeIn动画。
但是，当我尝试切换动画时，它可以工作，但隐藏它不会播放淡出动画。
下面是一个有效的
HTML：
<div class="window animated"></div>
<button style="margin: 100px;">Toggle Fade Window</button>
CSS:
.window{
background: blue;
width: 200px;
heigh
浏览 117提问于2018-08-12得票数 2
3回答
我正在用flash cs4制作动画，我正在制作一个播放/暂停按钮。单击时一切都会暂停，但播放按钮给了我一个问题。我有一些带有动画的电影剪辑，所以当我告诉它们播放时，它们不是恢复到原来的位置，而是无论是否应该播放，都会播放。有没有办法解决这个问题？
浏览 4提问于2011-06-29得票数 0
我试图动画一个按钮上的文字作为确认对话框。
天真地，onClick将状态设置为true，该状态反过来根据条件呈现文本组件。但是，由于状态卡在true，一旦单击按钮并播放动画，随后的单击就不会再次运行动画。
CodeSandbox：
App.jsx
import React, { useState } from "react";
import "./styles.css";
import styled, { keyframes } from "styled-components";
export const animation = keyfram
浏览 1提问于2020-05-14得票数 1
回答已采纳
情况
我有一个功能，它被调用的按钮点击，它应该绘制一个动画图表，每2秒更新图表。当用户再次单击该按钮时，当动画仍在运行时，动画应该停止。
我的当前解决方案
现在，我有下面的脚本，它在视觉上停止动画，但是底层的for-循环一直持续到后台的末尾：
var animRun = false;
$("#animateButton").on("click", function() {
if (animRun === false) {
redraw(data.slice(0,30))
//some CSS...
} else
浏览 0提问于2019-05-22得票数 0
回答已采纳
2回答
Css动画-停止和恢复动画
、、、、
我希望我的自定义元素在单击按钮时向右移动200px。因此，元素在单击时开始移动。在动画中，我希望能够再次单击按钮来停止，并让元素有一个动画返回到初始状态(从当前状态反向动画)。
我用css转换实现了这一点：
var state = false;
var button = document.getElementById("but");
button.onclick = clickA;
function clickA(){
state = !state;
var el = document.getElementById("el");
if
浏览 14提问于2017-05-02得票数 1
1回答
在Chrome中，当网站音频播放时，标签在web表单上的css动画失败，即使触发addClass函数的JS工作。但是，只要我通过单击右下角的声音栏来关闭音频，动画就会按预期工作。
为什么音频会影响css动画？
浏览 16提问于2019-07-10得票数 1
回答已采纳
我试图管理我的网站导航与css动画关键帧(我喜欢我取得的效果，我知道这不是最有效的方式)。当用户单击其中一个导航链接时，我通过css关键帧动画移动页面的内容。
//jQuery
$('#home').click(function() {
$("#Home-Content").addClass("Home-Content");
});
// css
.Home-Content {
animation: fall 7s;
animation-fill-mode: forwards;
}
动画工作得很好
浏览 6提问于2017-06-22得票数 0
回答已采纳
1回答
我使用的是内容滑块：
当我单击next/prev按钮时(或者当单击分页时)，我希望使用CSS3转换来控制每个滑块的内容如何动画输入/输出。
我想要的是一些非常基本的过渡，这样图标就会在一秒钟或文本之前滑动，并加入一些放松。我有信心我可以做的CSS位，它只是播放每张幻灯片，在点击。我对jquery不太在行。
我该怎么做呢？
到目前为止，这是我的滑块：
//
浏览 1提问于2012-11-22得票数 1
我有一个按钮，单击该按钮将显示一个<p> text <p/>元素，并给它一个动画(从上到下)，但现在我创建了另一个按钮，单击该按钮将删除<p>元素中的文本，以便在发生这种情况时添加一个动画，但当我在删除时将CSS编码为动画时，它似乎覆盖了前面的动画。
在CSS中是否有if there语句，或者我可以在JavaScript中这样做？这是香草JavaScript和CSS。
<button class="button" onclick="Click()">click me</button>
<p id=
浏览 8提问于2022-02-09得票数 2
回答已采纳
我用Bootstrap 4做造型。我有一个按钮在我的网页上，我希望用户能够触发一个击键。
我添加了下面的Javascript，它可以工作。
<script>
document.addEventListener('keyup', function (event) {
if (event.defaultPrevented) {
return;
}
var key = event.key || event.keyCode;
if (key === 'j' || key === 'KeyJ' |
浏览 1提问于2019-05-11得票数 1
回答已采纳
我有以下想要播放的动画：
public void onConfirmPayment(View view){
Animation flowAway = new TranslateAnimation(0, 400, 0, 0);
flowAway.setDuration(1500);
dummyTextView.setAnimation(flowAway);
flowAway.start();
}
该方法在单击ImageButton时调用。问题是:动画不会播放，除非当我转动设备(方向改变)时，它
浏览 4提问于2013-03-08得票数 0
回答已采纳
1回答
在按钮中添加动画
、、、、
我想在按钮上创建动画。按钮有它的形象。当点击按钮应该工作动画图像。一旦动画完成-显示以前的图像。
类似于以下算法：
关闭快门>点击>播放动画快门>显示图像
我已经准备好动画"Animation.gif“了。单击按钮时需要运行它。
这是如何组织的？谢谢
浏览 2提问于2012-10-24得票数 0
回答已采纳
1回答
当浏览器加载页面时，我来自adobe边缘的动画正在播放。只有当访问者单击我的html页面上的一个按钮(id=“触发器”)时，我才想播放动画。我精确地说，我不希望这个按钮成为我的舞台/动画的一部分。
我读到的回复提到了我动画中没有的文件，下面是我有的文件：
edge.6.0.0.min.js与“命名阶段”_edge.js
谢谢！
浏览 1提问于2016-01-08得票数 0
回答已采纳
我需要在ImageView上显示帧动画。我使用AnimationDrawable在一些点击事件上播放动画。如果我只看一张动画的话，效果会很好。但是，根据单击的按钮，我需要显示三个不同的animations.When，我正在播放第二个动画，OutOfMemoryError被抛出。正如其他一些关于同一问题的帖子所建议的，在动画结束后，我正在回收位图。但是在应用程序中，再次单击相同的按钮，我需要显示相同的动画。但是，当我尝试使用回收位图时，它不是working..is，有什么可以解决这个问题的吗？
浏览 2提问于2013-10-12得票数 2
回答已采纳
我的按钮有这个click事件： private void BtnRecord_Clicked(object sender, EventArgs e)
{
if (BtnRecord.BackgroundColor == Color.Coral)
{
blue_record_lottie.Loop = true;
blue_record_lottie.AutoPlay = true;
blue_re
浏览 36提问于2020-01-29得票数 1
回答已采纳
2回答
播放声音和动画
、、
我有一个动画，当一个按钮被按下时，它会播放。
我需要同时播放一个声音。
如果快速连续按下按钮两次，则声音将播放，然后在第二次按下时从开头开始播放，但由于声音比动画长度短，因此动画将仅循环一次。
有人有解决这个问题的办法吗？
也许有一种方法可以让声音按钮只在动画播放结束后才能再次工作？
//Panel 1 Sound Button Action.
- (IBAction)playSound:(id)sender {
AudioServicesPlaySystemSound(SoundID);
//Panel 1 Sound
NSURL *buttonURL = [NSURL
浏览 2提问于2013-12-15得票数 0
4回答
禁用锚泊按一下
、、、、
可能重复：
我在锚上有一个onclick，它会导致2个div改变它们的宽度(边栏切换的典型概念，同时扩大内容)。但是，如果我单击此锚并在动画仍在播放时再次单击它，它将从div当前的位置开始动画(例如，sideDiv通常在200 if宽，内容在1000 if宽，如果我启动动画，sideDiv应该转到0，内容应该是1200，然而，如果我再次单击，而边在100，内容在1100，他们将切换回300和900，这不是我想要的)。
所以，从逻辑上讲，我需要在动画播放的时候禁用锚-onclick，并且再次启用它，我知道按钮的这个过程，对于锚有类似的东西吗？
这是我的密码：
function togg
浏览 7提问于2011-05-19得票数 0
回答已采纳
2回答
我正在尝试通过单击HTML按钮来暂停CSS动画，使用JS来执行暂停。到目前为止，我已经尝试使用JS更改动画状态，但它不起作用-动画播放完了，按钮似乎没有效果。 下面是我的JS代码片段： var sun = document.getElementById("sun");
var sky = document.getElementById("sky");
var pauseBtn = document.getElementById("pauseBtn");
function pauseAnimation(){
if((pauseB
浏览 83提问于2021-10-19得票数 2
1回答
我页面上的元素是隐藏的(使用jquery的hide())，并通过用户单击菜单项(使用jquery的show())显示。
从隐藏状态显示的元素不是在播放wowjs或animate.css动画。如果我删除隐藏状态，并简单地默认为显示它们，那么动画将在页面加载时播放。
当元素进入可见/显示状态时，我希望动画能够播放，而不仅仅是当用户滚动到它们时(我知道wowjs是用来做的)。
浏览 0提问于2014-11-02得票数 1
回答已采纳
3回答
使用css @keyframes，我试图在单击元素时将一些动画附加到元素上。
.animate {
animation-name: action;
animation-duration: 2s;
animation-timing-function: linear;
background-color: green;
}
@keyframes action {
0% {
background-color: gray;
}
50% {
background-color: red;
}
100
浏览 1提问于2018-03-30得票数 8
回答已采纳
1回答
我正在用css动画我的网站导航，我的问题是这样的。
// Html file
<html>
<div class="class-one">
// some value
</div>
</html>
// Css file
.class-one {
width: 100px
height: 100px
animation: first-animation paused 7
浏览 4提问于2017-06-16得票数 0
回答已采纳
1回答
我正在尝试在一个离子应用程序中实现一个动画收藏按钮，但我遇到了一些问题。 该按钮在单击时按预期工作，但它也会触发每个其他按钮来播放动画。每次页面加载时，动画也会在所有按钮上播放。我怀疑我用于添加活动类的ngClass语句在页面加载帖子时以及在添加收藏夹时从可观察对象更新数据时以某种方式被触发。 <ion-button class="favourite" fill="clear" size="small" (click)="toggleFavourite( post, user.userId )">
<io
浏览 14提问于2020-08-26得票数 0
回答已采纳
1回答
我已经使用类似的代码在我的按钮上显示了一个不确定的进度条，但现在我只是想让预加载条出现，但在单击之前它们应该是不可见的。我想要在单击按钮时触发动画，以打开图库或隐藏加载动画，直到单击发生为止。
图片库可能需要2-10秒的加载时间，因此此按钮动画将一直播放到新页面加载。
我认为这可能是元素的名称，因为我已经将几段代码放在一起(最初是基于ladda的预加载器示例)，并且这些栏是新的。我希望在单击之前隐藏条的数据加载不起作用。
感谢您的任何建议或建议！
.button[data-loading]
Codepen：
目标是单击大按钮，然后在文本右侧开始播放条形图动画，直到加载新页面。并在ap
浏览 22提问于2019-08-05得票数 0
1回答
我在动画上遇到了问题:主动选择器。我不是CSS专家，所以我不知道这方面是否有任何速记解决方案。例如：
.actionButton{
&:active, &:focus{
animation: activeButton 2.5s alternate infinite ease-in;
}
}
@keyframes activeButton{
0% {transform: rotate(0deg);}
50% {transform: rotate(90deg);}
100% {transform: rotate(120deg
浏览 3提问于2021-08-12得票数 0
回答已采纳
因此，当我将鼠标悬停在按钮上时，我使用了Justin Aguilar的CSS3动画小抄中的代码来激活按钮上的动画：
<div id="object" class="pulse">
<script>
$('#animatedElement').hover(function() {
$(this).addClass("pulse");
});
</script>
问题是，即使我不再悬停在按钮上，动画也会继续播放。我该怎么做才能让按钮在每次用户悬停在它上面时都有动画效果，但在他们移开鼠标时停止
浏览 0提问于2017-09-08得票数 0
3回答
动画：
如果单击动画下按钮，jQuery将将.animateDown类添加到旋转器中。旋转器将向下动画到0，然后弹出返回到完全大小。
您将如何在CSS的末尾添加一个新的关键帧，以隐藏收缩后的旋转器？
或
在jQuery中，当自旋器缩小到0，然后隐藏它时，我会监听它吗？
CSS：
.animateDown {
-webkit-animation: animateDown .3s ease-in-out;
animation: animateDown .3s ease-in-out;
}
@-webkit-keyframes animateDown {
0%
浏览 1提问于2013-09-25得票数 3
回答已采纳
2回答
场景:您可以单击按钮，一些内容将向左移动(.animate)。当您快速单击按钮约3次，然后JQuery问题3 .animate左按顺序。
我不想那样！我将防止该终止，所以按钮将只有在动画完成时才能工作。谢谢你给我的每一个礼物！
伪码：
如果#内容不是动画(静止)
然后点击按钮
动画内容CSS“左”+900 CSS
button 您现在不能单击该按钮。但是如果你点击这个按钮，它就不会产生另一个动画了。
浏览 6提问于2010-11-04得票数 0
回答已采纳
我在观察一个带有纹章动画的bug在Android的一个按钮上。基本上，我有一个ViewGroup，称为ButtonContainer，包含2个按钮，称为OkButton和CancelButton。当用户单击CancelButton时，我希望通过将ButtonContainer的可见性设置为GONE来隐藏它。但是这造成了一个副作用，即CancelButton上的纹章动画是排队的，但从未播放过，下次ButtonContainer出现时它也会播放。这似乎发生了，因为按钮的OnClickListener是启动之前，纹章动画有机会播放。本文描述了这个精确的错误，并展示了视图的确切行为：
作者建议了一个解
浏览 2提问于2015-05-12得票数 9
回答已采纳
6回答
我有css代码：
body.start{-webkit-animation:srcb ease-in .4s 1;}
只在进入网站时播放一次
但问题是当动画完成的时候
我的网站上的按钮不起作用
如何在动画完成后删除body类"start“
或者在动画播放后删除类延迟x秒？
浏览 0提问于2012-12-15得票数 13
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
