我正试图在JavaScript中创建一个记忆卡游戏。我正在尝试添加一个重置按钮,现在允许我重新开始整个游戏。有什么想法,我如何可以翻转我的牌后,我已经完成了游戏和匹配的一切?我很感激你的帮助。以下是我的JS代码:
"use strict";
const cards = document.querySelectorAll(".memory-card");
let cardFlipped = false;
let lock = false;
let firstCard, secondCard;
function flip() {
if(lock) re
我正在做一个简单的记忆卡游戏。如果你连续点击两张相同的卡片,它们会保持打开状态。如果你连续点击两张不同的牌,它们都会在1.5秒内结束。为此,我使用setTimeout();但是,如果在1.5秒内用户单击任何其他卡,事件侦听器函数将再次开始运行,而setTimeout尚未完成第一次运行。这会使游戏崩溃。如何防止其他代码在setTimeout首次运行完成之前一直运行?任何建议都是非常感谢的!
const cards = document.querySelectorAll('.container__small');
let hasFlippedCard = false;
let fi
我正在努力学习使用Grunt.
当我在Jasmine运行程序中运行以下测试时:
他们工作..。这需要时间,因为最后一次测试会玩整个游戏。我把那个测试的超时时间提高到了60000,而且它在茉莉花中有效。
但是当我尝试使用Grunt运行测试时,它不允许游戏测试完成。我如何提高PhantomJS超时时间以允许这个测试有足够的时间完成?
Game Card
✓ can be created with a value
✓ has a DOM element for the card
✓ can flip
✓ can be discarded
Game
所以基本上我想用JS,HTML和CSS做一个记忆游戏。我想要能够点击卡片,然后应该翻转动画翻转。我不想创建20个按钮。有没有更好的方法来创建带有CSS动画的卡片。我差不多知道怎么做动画了。 .flip-card {
background-color: transparent;
width: 300px;
height: 200px;
border: 1px solid #f1f1f1;
perspective: 1000px;
/* Remove this if you don't want the 3D effect */
}
/* This c
我似乎找不到我的代码出了什么问题。以下是该项目的要求:
对于这个任务,您将使用HTML、CSS和JavaScript在浏览器中构建一个内存游戏。你的目标是建立一个基于卡的记忆游戏。玩家将看到一个收集的卡片,正面向下,并可以点击一张牌,以揭示什么是在下面。点击两张牌后,游戏应该检查它们是否匹配。如果他们这样做了,他们将继续面对。如果不是的话,牌应该在玩家面前显示一秒钟,然后翻转回来。*游戏的目标是匹配所有的配对。*
当使用我当前的代码玩游戏时,当它们不匹配时,卡片就不会返回。我认为,我的代码中的最后一条“如果其他”语句是造成这种情况的原因。我也认为可以通过创建另一个if语句来纠正它。
if (f
目前,我正在开发一个组合使用PHP和JavaScript的纸牌游戏应用程序。然而,我在事件处理方面遇到了一个问题。我想要的功能是让玩家能够点击一张卡片,然后会显示一条消息,指示再次单击该卡片以将其翻转。下面是我的基本设置:
function flipPlayerCard($card) {
gameAlert('Click the card again if you would like to flip it.');
$compareCard = $card;
$('body').off().on('click', '
我试图修改一个记忆游戏,并匹配三张卡片时,选择。但是,我似乎无法选择第三张卡,因此我的matchThreeCards功能无法工作。在加载和检查选择哪一张卡时,我应该使用不同的方法吗?有什么建议吗?希望这段代码有足够的可读性,让您能够理解。
我的脚本
var cardFront = document.createElement("div");
var gameOneButton = document.querySelector("#gameOneButton");
var gameTwoButton = document.querySelector("#g
我使用jquery flip.js来翻转元素。但是当我点击div元素时,div被翻转了。但是我需要在点击flip buttton时翻转元素,当点击flip back按钮时再次翻转回来。
我该怎么做呢?
<div id="card-1" class="card">
<div class="front">
Front: Cursus aliquet mus et sociis, placerat adipiscing a placerat magnis integer nisi lacus in, tu
你好,我已经改变了翻转卡元素从w3schools,并添加了javascript,他们将旋转60px,如果他们在视口中,用户可以理解,有一个文本后面的卡。它工作良好的卷轴,但现在我释放的悬停效果不是working.Can,你能帮我吗?
var x = 0;
$.fn.isInViewport = function() {
var elementTop = $(this).offset().top;
var elementBottom = elementTop + $(this).outerHeight();
var viewportTop = $(window).scrol
我有一些自动翻转动画的HTML翻转卡片。我正在尝试实现一个功能,这样当用户滚动到他们看到翻转卡片的部分时,就会开始翻转动画。如果用户滚动过多,翻转卡片不再可见,请停止翻转动画。以下是JavaScript代码: function isScrolledIntoView(elem) {
var docViewTop = $(window).scrollTop();
var docViewBottom = docViewTop + $(window).height();
var elemTop = $(elem).offset().top;
我正在尝试制作一个带有卡片的HTML响应网页,当你单击它们时,卡片会翻转180度,在我用onclick事件的id更改div类后,我的CSS样式搞乱了,并将卡片随机放在屏幕上。我该如何解决这个问题呢?
我试图将CSS类的样式复制到id样式,但这会破坏动画。
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
.container { //all of the divs are in a container div
display: flex;
flex-direction: row;
flex-wrap:
所以,我正在尝试简单的纸牌游戏。我有带有draw函数的类“player”,以及公共成员deck和hand,它们都是数组。
我需要从牌组中抽出一张牌,将它放在手中,并将其显示在玩家的“手”区域。我关心的是我做“翻转”和“播放”按钮的方式(通过闭包)。
代码如下:
littlegame.player.prototype.draw = function() {
if (this.canDrawCard()) {
var card = this.deck.draw(); // this.deck is Array
//Create card element o
我创建了一个记忆卡游戏,我有一个问题,最后一张卡没有翻转之前,警报即将到来,他们已经完成游戏。我被困在thios上已经有一段时间了,我已经在下面插入了js代码。我对这一切都很陌生,所以任何帮助都会很好。
const badges = document.querySelectorAll(".badge-card");
//Declaring the variables
let hasFlippedCard = false;
let isBoardLocked = true;
let cardOne, cardTwo;
let noOfMatches = 0;
//Funtio
我现在正在做一个记忆游戏项目。一个我正在尝试实现的函数,在两秒钟后翻转卡片,而不是让它们立即翻转。
let openCards = [];
function cardActions(card) {
// prevent function from adding two classes over and over again
if (!(card.classList.contains('open'))) {
// display the card's symbol
card.className += ' ope
我一直在做一个学校项目,其中包括制作一个记忆卡游戏,但我在创建一个函数时遇到了麻烦,这个函数告诉我所有的卡都被正确地翻转了(因此游戏已经结束)。
这是我到目前为止在我的scripts.js中拥有的:
const cards = document.querySelectorAll('.memory-card');
let hasFlippedCard = false;
let lockBoard = false;
let firstCard, secondCard;
let allCardsFlipped = false;
function flipCard() {
if
这段代码抛出了一个未捕获的TypeError。我正试图通过点击翻转卡片来翻转它。但是代码给出了这个错误:“未捕获TypeError:无法设置未定义的属性'transform‘”问题是什么?在这里,我将试图旋转的div命名为"flip-card“,还在css属性中注释了hover属性。 代码: function rotate_card(){
console.log("here");
var j=document.getElementsByClassName("flip-card");
console.log(j);
var k