Question

我最近制作的网页与着名的“Cookie Clicker”游戏非常相似（如果你不知道它是什么的谷歌Cookie Clicker），我想知道如何对cookie进行'onclick'效果（来自cookie clicker）完成了。

当你点击Cookie Clicker上的cookie时，会出现一个文本框，从你的光标弹出+1，然后逐渐淡出。请随意查看原始Cookie Clicker页面上的效果（我真的更喜欢经典cookie点击器的效果，你可以在当前版本的cookie点击器的右上角的href链接上找到它。）

我的onclick图像（顺便说一下，它不是一个cookie）已经有onclick / mouseover效果（clickcounter / audio effects），所以我需要一些与我已经拥有的东西合作的东西。此外，cookie点击器还提供了一个小饼干，以与+1文本相同的方式弹出和淡出，这在我的网站上也会非常棒。

您还可以点击我的StackExchange个人资料上的链接查看我的页面。

我整天坐在这里，试图编写脚本，但我唯一的结果是我的脚本崩溃或我的按钮从我的网页上消失了。有人可以帮我这个吗？如有必要，将在评论中提供有关我的脚本的其他信息。

提前感谢所有人！

-Daniel

（这些是我的onclick效果/按钮的当前脚本。所有来源都是本地文件。）

的Javascript

function clickCounter(){
     var audio = document.getElementById("audio");
     audio.play();
     if(typeof(Storage)!=="undefined"){
         if (localStorage.clickcount)
         {
             localStorage.clickcount=Number(localStorage.clickcount)+1;
         }
         else
         {
             localStorage.clickcount=1;
         }
         document.getElementById("result").innerHTML="<center><b>You have clicked the poop
         </b>"+ localStorage.clickcount + "<b> times!</b></center>";
     }
     else{
         document.getElementById("result").innerHTML="I'm sorry to inform you that your browser
         does not support this web storage... I guess you could say that your browser is...
         shit! awwww yeaahh!";
     }
     cursor: pointer;
}

HTML

<center>
     <font face="chiller" color="#603913" "font size="300" <align="center"><b>Click the
     poop!</b>
</center>
<center>
    <p><picture onclick="clickCounter()"><picture
     onmouseover="document.getElementById('touch').play()"><img src="poop.png"></button></p>
</center>
<audio id="audio" src="fart-01.wav"></audio>
<audio id="touch" src="sticky goo.wav"></audio>
<div id="result"></div>

Onclick效果。从光标弹出文本（+1）（如在cookie点击器上）

0 个答案: