Question

好的，所以我有这个客户端，只需要在进入他的网站时拥有奇特的动画。 WordPress的。事情应该是一个图片/按钮，点击播放“引擎”声音并显示主页面。

我正在考虑在单独的DIV中执行此操作，只需单击按钮并播放声音即可“消失”。我查了一下，我知道如何做到这一点，但我几乎没有问题。

实现上述效果的最佳方式是什么？我认为CSS3 + HTML5 +有点jquery是要走的路。但也许有更好的东西。在CSS技巧上获取声音的示例：https://css-tricks.com/play-sound-on-hover/
如果整个事情是在单独的div中，那么声音应该“完整”而不会突然中断。如果我错了，请纠正我
现在可能是最困难的事情：如何确保动画在访问主页时不会始终显示。设置cookie？如果是这样，我该怎么做？

Answer 1

1）您可以使用纯javascript播放声音，只需获取音频元素并在按钮点击处理程序上使用播放功能（例如下面的代码）：

`object.onclick = function(){
  document.getElementByTagName('audio')[0].play();
};`

2）即使你隐藏了这个div，声音也会播放。

3）您可以使用纯javascript设置cookie：

`document.cookie = "name=value; path=/; expires=" + date.toUTCString();`

然后你可以使用下面的函数检查cookie是否存在：

`function getCookie(name) {
  var matches = document.cookie.match(new RegExp(
    "(?:^|; )" + name.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g, '\\$1') + "=([^;]*)"
  ));
  return matches ? decodeURIComponent(matches[1]) : undefined;
}`

如果您是jquery家伙，可以使用https://plugins.jquery.com/cookie/

具有声音和设置cookie的按钮onclick动画

1 个答案: