Анимированные штуки

Добро пожаловать!

Зарегистрировавшись у нас, вы сможете обсуждать, делиться и отправлять личные сообщения другим участникам нашего сообщества.

Зарегистрироваться!
Пользователь
Регистрация
7 Окт 2025
Сообщения
145
Как сделать также ?
 
Заблокированный
Регистрация
11 Май 2025
Сообщения
157
Обратите внимание, пользователь заблокирован на форуме. Не рекомендуется проводить сделки. Мы не несем ответственности за действия пользователя вне форума.
 
𝚖𝚘𝚛𝚜 𝚌𝚎𝚛𝚝𝚊, 𝚑𝚘𝚛𝚊 𝚒𝚗𝚌𝚎𝚛𝚝𝚊.
Команда форума
Администратор
Регистрация
21 Янв 2023
Сообщения
1,510
переходите в виджеты: admin.php?widgets/
создаете виджет
ключ виджета: newyear (или любой другой)
заголовок: не указываем
позиция отображения: "Список форумов: выше списка узлов"

шаблон;
код:
<style>
.gift-container {
    text-align: center;
    padding: 20px;
    background: #2a2a2a;
    border-radius: 12px;
    border: 1px solid #444;
    width: 100%;
    box-sizing: border-box;
}

.tree { font-size: 28px; margin-bottom: 8px; }

.gift-title {
    color: #fff;
    font-size: 18px;
    margin-bottom: 12px;
    line-height: 1.3;
}

.gift-icon { font-size: 50px; margin: 12px 0; }

.one-time {
    color: #ff6b6b;
    font-size: 13px;
    margin-bottom: 15px;
}

.open-btn {
    background: #ff6b6b;
    border: 2px solid #ffd700;
    color: #fff;
    padding: 10px 30px;
    font-size: 16px;
    font-weight: bold;
    border-radius: 8px;
    cursor: pointer;
    text-transform: uppercase;
}

.open-btn:hover { background: #ff5252; }

.result-text {
    display: none;
    font-size: 16px;
    color: #ffd700;
    font-weight: bold;
    margin-top: 12px;
}

.result-text.show { display: block; }

.bottom-gif { margin-top: 20px; }
.bottom-gif img {
    width: 100%;
    max-width: 160px;
    height: auto;
}
</style>

<div class="gift-container">
    <div class="tree">🎄</div>
    <div class="gift-title">chtoto - CHRISTMAS GIFT</div>
    <div class="gift-icon">🎁</div>
    <div class="one-time">Только 1 раз на человека</div>
    <button class="open-btn" onclick="openGift()">ОТКРЫТЬ</button>
    <div class="result-text" id="result">.</div>
    
    <div class="bottom-gif">
        <img src="https://i.giphy.com/7Zy3QalQCyD9stmf39.gif">
    </div>
</div>

<script>
var giftPrizes = [
    'Вы выиграли: что-то 1',
    'Вы выиграли: что-то 2',
    'Вы выиграли: что-то 3',
    'Вы выиграли: что-то 4',
    'Вы выиграли: что-то 5',
    'Вы выиграли: что-то 6',
    'Вы выиграли: что-то 7',
    'Вы выиграли: что-то 8'
];

function openGift() {
    var button = document.querySelector('.open-btn');
    var resultDiv = document.getElementById('result');
    var randomPrize = giftPrizes[Math.floor(Math.random() * giftPrizes.length)];
    
    button.style.display = 'none';
    resultDiv.textContent = randomPrize;
    resultDiv.classList.add('show');
}
</script>

получаем результат;
1765140151321.png1765140138105.png

1765140170053.png1765140175500.png
 
𝚖𝚘𝚛𝚜 𝚌𝚎𝚛𝚝𝚊, 𝚑𝚘𝚛𝚊 𝚒𝚗𝚌𝚎𝚛𝚝𝚊.
Команда форума
Администратор
Регистрация
21 Янв 2023
Сообщения
1,510
Команда форума
Модератор
Регистрация
4 Ноя 2024
Сообщения
1,440
Сверху