ハロウィンの飾り付け 👻

:discourse2: Summary Halloween Decorations will add some spooky flair to your forum this festive season!
:eyeglasses: Preview Preview on Discourse Theme Creator
:hammer_and_wrench: Repository Link https://github.com/discourse/discourse-halloween-decorations
:open_book: New to Discourse Themes? Beginner’s guide to using Discourse Themes

Install this theme component

Features

:information_source: This theme component only shows for desktop view. :desktop_computer:

This component has three flairs:

  • Bats animation
  • Spider web on both sides
  • Pumpkin loading animation

Happy Halloween! :ghost: :spider_web:

:discourse2: Hosted by us? Theme components are available to use on our Standard, Business, and Enterprise plans.

Last edited by @JammyDodger 2024-10-23T15:06:22Z

Last checked by @Lilly 2024-10-14T21:44:14Z

Check documentPerform check on document:
「いいね!」 37

これは素晴らしいです。ありがとうございます!

「いいね!」 2

3件の投稿が新しいトピックに分割されました:Where’s the pumpkin?

これはまだデスクトップ専用ですか?

「いいね!」 1

はい、そうです。
OPに追記しておきます。ありがとうございます。

「いいね!」 2

フォーラムをクリックした際に、リフレッシャーの内容を非表示にするオープン画面のアニメーションを表示できると思います。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <style>
    #custom-video-container {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: #2cb9e4;
      z-index: 9999;
      display: flex;
      justify-content: center;
      align-items: center;
      transition: visibility 0s 1s, opacity 1s linear; /* 添加过渡效果 */
      visibility: visible;
      opacity: 1;
    }

    #custom-video {
      width: auto; /* 设置宽度为100% */
      height: auto; /* 高度自动适应 */
    }
  </style>
</head>
<body>
  <div id="custom-video-container">
    <video id="custom-video" autoplay muted>
      <source src="https://www.justnainai.com/uploads/default/original/2X/e/e4faa6e98fd8890bbd33a24ef27f63cbb30a9d16.mp4" type="video/mp4">
    </video>
  </div>

  <script>
    document.addEventListener('DOMContentLoaded', () => {
      const videoContainer = document.getElementById('custom-video-container');
      const video = document.getElementById('custom-video');

      video.addEventListener('ended', () => {
        setTimeout(() => {
          videoContainer.style.visibility = 'hidden';
          videoContainer.style.opacity = '0';
        }, 10); // 视频结束后3秒钟隐藏
      });
    });
  </script>
</body>
</html>
「いいね!」 1

メンバーはこのアニメーションが大好きです。とてもよくできています。邪魔にならず、ちょうど良い量です。カボチャのアニメーションはとても速いので、ほとんど見間違いかと思うほどです(笑)。私のモバイルユーザーはとても残念がっています(笑)、彼らも欲しいと言っています!そしてうちの猫はコウモリを見つけました!ベテランズデー、感謝祭、クリスマス、新年、バレンタインデー、セントパトリックデー、イースター、メモリアルデー、7月4日、レイバーデーなどの祝日や、その間の時期の雪、花、ビーチ、秋の葉などの楽しいものも期待できますか?

「いいね!」 3

Hi @famousamos.1 :wave: Discourse Metaへようこそ :slight_smile:

以下のようなものもあります。

「いいね!」 6

やったー!私のメンバーはとても興奮するでしょう。彼らは常に楽しい装飾を期待していることを知っていますよね??(笑)

「いいね!」 1

ただし、モバイルを使用している場合は別です…まあ、数匹のコウモリしか見えないことに興奮する人もいるかもしれません。

これはモバイルでは動作しないため、desktop としてタグ付けする必要があります。

「いいね!」 2

これは本当です。私のモバイルメンバーはまだこれらを見ることができません。

「いいね!」 2

特定の時間に有効にすることはできますか?例えば、毎年ハロウィーンにのみこの装飾が表示されるようにします。