JS:如何让多张卡片在网站上翻转？

文章/答案/技术大牛

发布

1回答

javascript、html、css、card、card-flip

嗨，所以我发现这张卡片翻转动画https://codepen.io/desandro/pen/LmWozd，我决定为我的网站设计它的样式。我打算有一堆这样的卡片(字母表中的每个字母对应一张)。然而，目前该代码不能用于多张卡。我不太熟悉JavaScript，所以我不明白为什么这段代码不能工作。我已经尝试了一些我在网上找到的方法，但似乎没有一个有效，但它们也不适用于翻牌，所以我猜这可能是问题的一部分。如有任何帮助，我们不胜感激！

浏览 20提问于2021-03-23得票数 1

回答已采纳

1回答

前部和后部翻转效果

jquery、css、rotation、css-animations、flip

我想要创造一个翻转效果，在鼠标上触发，然后在鼠标出来时翻转回前面板。因此，必须有一个正面和背面的卡片，应该翻转: HTML： <div class="front"> Front-Content </div> <div class="b

浏览 1提问于2014-09-25得票数 2

回答已采纳

3回答

翻转按钮触发的卡片

javascript、css

我想有两张卡片的定义，并翻转他们切换视图。我想要一个编辑和保存按钮，最终触发翻转。但我被困在触发按钮上了(还在学习)$('.flip-card').on('click',

浏览 14提问于2019-12-09得票数 1

回答已采纳

3回答

如何在html中并排创建两张翻转卡片？

html、css

基本上，我是一个彻头彻尾的菜鸟，对于一个非常基本的请求，我可能需要一些帮助:)我已经尝试过了，并且能够创建两张叠加在一起的翻转卡片，但有没有一种方法可以让它们并排(我指的是附加的非常基本的屏幕截图)。有没有办法使用上面的模板呢？我已经在网上搜索过这个答案，但回复的对象是比我知

浏览 1提问于2021-01-21得票数 1

1回答

创建用于比较值的高阶函数

javascript、jquery、compare、higher-order-functions

我们需要使用jQuery或JavaScript来翻转卡片，比较它们，然后取消翻转它们。 $(this).childre().css('opacity', &#x

浏览 2提问于2016-06-06得票数 0

2回答

Javascript -如何创建使用onclick()翻转的多张翻转卡片？

javascript

在我正在开发的纸牌游戏中添加多张翻转卡片时遇到了问题。我的代码在一张卡上运行良好，但由于我使用getElementById使其工作，所以当我添加更多卡时，它停止工作，因为ID是唯一的。有什么想法吗？

浏览 0提问于2020-12-29得票数 2

1回答

我想在Qt QML中做两张卡片同时翻转

qt、qml

当我点击按钮时，我想让两张卡片翻转，但我可以让一张卡片翻转，我不知道如何同时做到这一点？

浏览 0提问于2012-02-13得票数 0

2回答

多张卡片的翻转动画

javascript、css、animation

我有四张放置在网格中的卡片，我想让它们动起来。我已经成功地制作了其中一张卡片的动画，但当我尝试为其他卡片添加更多的动画javascript时，不仅这些卡片没有动画，而且之前成功制作动画的第一张卡片也不再翻转。function () {}); 当我尝试为.card-2添加额外的"const card“时-内部到.card-4-内部所有

浏览 61提问于2021-02-08得票数 0

1回答

角度:轻拍(半翻转)动画

angular、typescript、angular-animations

我的卡片有正面和背面的垂直翻转动画。400ms') transition('1 => 0', [ ]) ] 但我想要做的是动画一张卡片我的意思是，卡片不会完全翻转，而是半翻转，改变卡片上的内容，然后翻转回来，显示背面。当然，这意味着我的卡片将只有一个面，在那里我可以在内

浏览 14提问于2021-06-03得票数 0

回答已采纳

2回答

如何使用动画/动画在颤振中的英雄过渡期间没有运行？

animation、dart、flutter、widget

我有一张描绘产品的卡片。当一张卡片被点击时，我希望它翻转(围绕Y轴)来显示显示细节的“另一面”，同时增长来填充屏幕。持续时间0.0 -卡片显示正面，在网格视图中。我已经设法使翻转动画工作，但有困难的是，如何也让它运行在英雄过渡。

浏览 0提问于2019-02-01得票数 5

回答已采纳

2回答

背景图片似乎在Chrome中“闪烁”(我不希望它这样)

css、google-chrome、background、background-image

如果你在Chrome中查看 (例如vs Firefox )，背景似乎是闪烁/闪烁/模糊的。图像似乎从一边移动到另一边。我希望背景图像不要这样做。我不明白为什么它在Chrome中是这样的，而在firefox中却没有。body{ background-image:url(../images/bg.png);} 显然，唯一相关的行是background-image:

浏览 3提问于2012-02-12得票数 1

2回答

配置文件悬停卡可显示用户关注或查看配置文件

html、css、angular、typescript

我试图建立个人资料悬停卡在我的网站上的按钮，以跟随和取消关注用户，我能够建立这个，直到悬停部分，但悬停卡是消失时，当我移动出我的个人资料缩略图，我如何解决这个问题，使悬停卡停留在鼠标上方，并消失在鼠标移出

浏览 25提问于2021-06-11得票数 0

4回答

如何添加一个简单的卡翻转动画？

javascript、jquery、css、css-transitions、css-transforms

到目前为止，我的大部分工作，但卡翻转动画是一个痛苦的a**。当你拖放一张卡片时，卡片的背面会被一个正面所取代。现在，当这个动作发生时，我想添加一个漂亮的翻转动画。卡的拖动/处理区域是很远的。那么，我<

浏览 0提问于2014-06-14得票数 4

回答已采纳

3回答

bot框架中适配卡的HostConfig

node.js、botframework、adaptive-cards

我在机器人框架node.js SDK中使用了适配卡。将这些适配卡发送给我的用户已经成功。现在我想更进一步：提前感谢

浏览 1提问于2017-05-18得票数 0

3回答

如何在单击项目时进行CSS转换？

javascript、html、css、css-animations

当卡在元素上悬停时，使其旋转(特别是翻转)。当我点击元素(.card)时，我希望它是翻转的。 <h1></h1> </div> 我尝试使用:active伪类，但在这种情况下，我需要持有卡，以保持翻转我想在一个页面上制作多张卡片，并让它们在点击时翻转</e

浏览 3提问于2020-04-03得票数 2

回答已采纳

2回答

在使用jQuery时防止翻转

jquery

很难给它一个好的简短标题，所以这里有一些细节：另外，这会影响页面加载吗？有没有更快的解决方案？ I

浏览 0提问于2013-06-26得票数 0

1回答

让我的翻转悬停查询脚本脚本在移动上工作

javascript、jquery、mobile

我目前正在我的网站上工作，并使用以下代码在悬停时翻转一张卡片。然而，我在手机上测试了它，卡在触摸上翻转，但是只有在我点击另一张卡的时候，才不会倒转。有谁知道我如何或者是否可以修改这些代码(或者我可以使用不同的代码？)才能在手机上工作。谢谢!

浏览 6提问于2016-12-17得票数 0

回答已采纳

1回答

如何将首页的moodle moove类别列表改为卡片？

php、moodle

我在一个moodle网站上工作了一段时间，在开发方面遇到了麻烦。当在网站上工作时，我想让类别的显示为卡片，如图1所示：但是，类别只是在页面上显示为一个列表，如图2所示：有没有人知道我可以更改类别来显示示例中的卡片？谢谢

浏览 1提问于2018-08-02得票数 0

2回答

CSS/Javascript带有类和id的多重div翻转

javascript、jquery、css

我试图在同一个页面上翻转多个div，使用我在其他地方找到的代码()，并根据自己的需要进行修改。干杯!

浏览 2提问于2015-02-15得票数 0

回答已采纳

2回答

我如何才能.toggle(“倒装”)仅父元素？

javascript、jquery

console.log("CLICK");}); 我试图有多个元素可以单独翻转我想使用该元素中的一个按钮来触发该父元素的翻转。我不知道从哪里开始，所以我真的希望你们能帮我。

浏览 0提问于2014-01-08得票数 1

回答已采纳

点击加载更多