Загрузка...

UI Season
New Year vibe 2026

Thread in Extentions created by Dimeria Dec 29, 2025. (bumped Jan 1, 2026) 307 views

  1. Dimeria
    Dimeria Topic starter Dec 29, 2025 Надежные сервера - https://lolz.live/threads/8521489/ 9,376 Oct 21, 2018
    [IMG] [IMG] [IMG] [IMG] [IMG] [IMG] [IMG] [IMG] [IMG]
    [IMG]
    Понимаю что поздновато, но всё же.
    Скрипт даёт возможность ощутить новогоднее настроения не выходя за пределы форума. Он добавляет новые оформления для некоторых элементов форума и также, позволяет как отключать не понравившиеся оформления, так и менять их, благодаря удобной кнопки (в виде рождественской ёлки) настройки в левом нижнем углу .
    ( Классическое оформление гирлянд, может нагружать Ваш пк)
    [IMG][IMG]
    СПОСОБ УСТАНОВКИ:

    :smile_snowball: Всех С наступающим Новым Годом !!! :anime_hi:
    [IMG] [IMG] [IMG] [IMG]

    1. Установите TamperMonkey.​
    2. Через ручную вставку в расширение TamperMonkey:​
      JS
      // ==UserScript==
      // @name New Year Vibe
      // @namespace http://tampermonkey.net/
      // @version 1.4.1
      // @description Новогодний вайб для lolz.live
      // @match https://lolz.live/*
      // @grant none
      // @run-at document-start
      // ==/UserScript==

      (function() {
      'use strict';

      const DEFAULT_SETTINGS = {
      snow: true,
      frostyHeaders: true,
      frozenAvatars: true,
      fluffyStyle: true,
      garland: true,
      garlandType: 'classic',
      threadToy: true,
      candyBorder: true,
      textReplace: true,
      candyColor1: '#ff6464',
      candyColor2: '#ffffff',
      candyOpacity: 0.8,
      candyBrightness: 1.0,
      snowAmount: 50,
      snowSizeMin: 1,
      snowSizeMax: 10,
      snowSpeed: 5
      };

      let settings = { ...DEFAULT_SETTINGS };

      function loadSettings() {
      try {
      const saved = localStorage.getItem('newYearVibe_settings');
      if (saved) {
      settings = { ...DEFAULT_SETTINGS, ...JSON.parse(saved) };
      }
      } catch (e) {}
      }

      function saveSettings() {
      try {
      localStorage.setItem('newYearVibe_settings', JSON.stringify(settings));
      } catch (e) {}
      }

      loadSettings();

      const imgDropSrc = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAUCAYAAABc0f5lAAAACXBIWXMAAA7EAAAOxAGVKw4bAAABWElEQVQ4jZ2SvUtCURhAn3vvilYt/QELCg0RDRUtNghFk4tDQ0s1tTjY0t/Q3B/Q0B8QQUuD0JCLi4s1FkFDg5aWSIKCLi4i4u71dDjc+3pB6AOncM75zXnPAY5t27hP6t0iIgIA27axbRvX6zUajQbq9Tp8Ph98Ph+i0ai0220q1SpSqRTS6TQEQUCpVEKxWMRgMEDrX4rFIqLRKNbrNQBgMpmg2+3i+fmZqtUq/H4/kskks9ksg8Egrq6uYBgGnU4HpmlhtVrB4/HA5/PB4XDg+PiYh4cHFItFdDodyLIMADg9PaVarfL7/ZFlWd4XCoX3x8dHBEFAu91GJBIhTdMIgqAAwP39PbLZbL/f74dlWTg4OMDr6yuWyyXsdjt0XYfFYkG5XEa73SbHcfB6vbAsCx8fH9jf3wcA8DyP0WjEWq2G09NT5PN58DyPX+U9/4kCgQCy2Szr9TrC4TCSySR+AV81d0e+wQ1/AAAAAElFTkSuQmCC";

      const style = document.createElement('style');
      style.innerHTML = `
      :root {
      --nyv-candy-c1: 255,100,100;
      --nyv-candy-c2: 255,255,255;
      --nyv-candy-opacity: 0.8;
      --nyv-candy-brightness: 1;
      }

      .garland-wrapper, .sidebarWrapper, .section, .secondaryContent {
      overflow: visible !important;
      position: relative !important;
      z-index: 1;
      }

      .snow-wrapper { position: relative !important; overflow: visible !important; }

      .snowflake {
      position: fixed;
      top: -50px;
      color: rgba(255, 255, 255, 0.9);
      user-select: none;
      pointer-events: none;
      z-index: 9999;
      animation: fall linear forwards;
      will-change: transform;
      text-shadow: 0 0 3px rgba(255,255,255,0.8);
      }
      @keyframes fall {
      to { transform: translateY(110vh) rotate(360deg); }
      }

      .style-frosty::before {
      content: '';
      position: absolute;
      top: -8px;
      left: -2px;
      right: -2px;
      height: 14px;
      background: linear-gradient(180deg, #ffffff 20%, #b3e5fc 100%);
      box-shadow: 0 0 5px rgba(135, 206, 250, 0.5), inset 0 -1px 3px rgba(255,255,255, 0.8);
      border-radius: 50% 50% 40% 40% / 80% 80% 20% 20%;
      z-index: 100;
      pointer-events: none;
      }

      .style-avatar-frost { position: relative !important; }
      .style-avatar-frost::after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: 45%;
      background-image:
      linear-gradient(180deg, rgba(255, 255, 255, 0.9) 0%, rgba(220, 245, 255, 0.7) 70%, rgba(220, 245, 255, 0.0) 100%),
      radial-gradient(circle at 10% 20%, rgba(255,255,255,0.9) 1px, transparent 2px),
      radial-gradient(circle at 30% 10%, rgba(255,255,255,0.9) 2px, transparent 3px),
      radial-gradient(circle at 50% 30%, rgba(255,255,255,1) 2px, transparent 4px),
      radial-gradient(circle at 90% 25%, rgba(255,255,255,0.9) 2px, transparent 3px);
      background-repeat: no-repeat;
      box-shadow: inset 0 2px 15px rgba(255,255,255, 1), 0 1px 5px rgba(135, 206, 250, 0.6);
      border-radius: 0 0 30% 30% / 0 0 20% 20%;
      border-bottom: 2px solid rgba(255, 255, 255, 0.5);
      z-index: 999;
      pointer-events: none;
      }

      .style-fluffy::before {
      content: '';
      position: absolute;
      top: -12px;
      left: -5px;
      right: -5px;
      height: 25px;
      background: linear-gradient(to bottom, #ffffff 40%, #eef6ff 100%);
      border-radius: 40% 40% 50% 50% / 50% 50% 30% 30%;
      box-shadow: 0 4px 10px rgba(0,0,0,0.25), inset 0 2px 5px rgba(255,255,255,1);
      z-index: 100;
      pointer-events: none;
      }

      #page_info_wrap.style-fluffy::before {
      background: linear-gradient(to bottom,
      rgba(255, 255, 255, 0.95) 0%,
      rgba(255, 255, 255, 0.8) 60%,
      rgba(179, 229, 252, 0.3) 100%
      ) !important;
      box-shadow: inset 0 2px 5px rgba(255, 255, 255, 0.9), 0 2px 5px rgba(255, 255, 255, 0.1) !important;
      border-bottom: none !important;
      height: 35px !important;
      }

      .frost-drop {
      position: absolute;
      top: 5px;
      width: 6px;
      height: 6px;
      background: #29b6f6;
      box-shadow: 0 0 4px #0288d1;
      border-radius: 0 50% 50% 50%;
      transform: rotate(45deg);
      z-index: 99;
      opacity: 0;
      pointer-events: none;
      will-change: transform;
      }
      @keyframes frostDripAnim {
      0% { top: 2px; opacity: 0; transform: rotate(45deg) scale(0); }
      20% { opacity: 1; transform: rotate(45deg) scale(1); }
      40% { top: 4px; }
      100% { top: 35px; opacity: 0; transform: rotate(45deg) scale(0.5); }
      }

      .img-drop {
      position: absolute;
      top: 10px;
      width: 6px;
      height: 9px;
      z-index: 99;
      opacity: 0;
      pointer-events: none;
      will-change: transform;
      }
      @keyframes imgDripAnim {
      0% { transform: translateY(0) scaleX(1); opacity: 0; }
      5% { opacity: 1; }
      15% { transform: translateY(3px) scaleX(1.1); }
      85% { opacity: 0.8; transform: translateY(40px) scaleX(0.9); }
      100% { transform: translateY(45px) scaleX(0.5); opacity: 0; }
      }

      .garland-bulb {
      position: absolute;
      width: 7px;
      height: 7px;
      border-radius: 50%;
      z-index: 10001;
      animation: flash 1s infinite alternate;
      pointer-events: none;
      }
      .bulb-red { background: #ff3333; box-shadow: 0 0 4px #ff3333; animation-delay: 0s; }
      .bulb-gold { background: #ffcc00; box-shadow: 0 0 4px #ffcc00; animation-delay: 0.25s; }
      .bulb-green { background: #33ff33; box-shadow: 0 0 4px #33ff33; animation-delay: 0.5s; }
      .bulb-blue { background: #3333ff; box-shadow: 0 0 4px #3333ff; animation-delay: 0.75s; }
      @keyframes flash {
      from { opacity: 0.5; transform: scale(0.9); }
      to { opacity: 1; transform: scale(1.3); box-shadow: 0 0 8px currentColor; }
      }

      .thread-toy {
      position: absolute;
      top: -5px;
      right: 20px;
      width: 20px;
      height: 40px;
      pointer-events: none;
      z-index: 50;
      transform-origin: top center;
      animation: swing 1.5s ease-in-out infinite alternate;
      }
      .thread-toy::before {
      content: '';
      position: absolute;
      left: 50%;
      top: 0;
      width: 1px;
      height: 25px;
      background: rgba(255, 255, 255, 0.5);
      }
      .thread-toy::after {
      content: '';
      position: absolute;
      left: 50%;
      top: 25px;
      transform: translateX(-50%);
      width: 12px;
      height: 12px;
      border-radius: 50%;
      background: radial-gradient(circle at 30% 30%, #ff6b6b, #c0392b);
      box-shadow: 0 2px 4px rgba(0,0,0,0.3);
      }
      .thread-toy .shine {
      position: absolute;
      top: 27px;
      left: 7px;
      width: 3px;
      height: 3px;
      background: #fff;
      border-radius: 50%;
      opacity: 0.8;
      z-index: 51;
      }
      @keyframes swing {
      from { transform: rotate(-8deg); }
      to { transform: rotate(8deg); }
      }

      .style-candy-border {
      position: relative !important;
      background: #2d2d2d !important;
      z-index: 1;
      border-radius: 4px;
      }
      .style-candy-border::before {
      content: '';
      position: absolute;
      top: -1px;
      left: -1px;
      right: -1px;
      bottom: -1px;
      z-index: -1;
      border-radius: 5px;
      background: repeating-linear-gradient(
      45deg,
      rgba(var(--nyv-candy-c1), var(--nyv-candy-opacity)),
      rgba(var(--nyv-candy-c1), var(--nyv-candy-opacity)) 10px,
      rgba(var(--nyv-candy-c2), var(--nyv-candy-opacity)) 10px,
      rgba(var(--nyv-candy-c2), var(--nyv-candy-opacity)) 20px
      );
      background-size: 200% 200%;
      animation: candyWrap 30s linear infinite !important;
      filter: brightness(var(--nyv-candy-brightness));
      will-change: background-position;
      }

      @keyframes candyWrap {
      0% { background-position: 0% 0%; }
      100% { background-position: 100% 100%; }
      }

      .style-garland-smooth::before {
      content: '';
      position: absolute;
      inset: -6px;
      pointer-events: none;
      z-index: 1000;
      background:
      repeating-linear-gradient(90deg, #ff3333 0 6px, #ffcc00 6px 12px, #33ff33 12px 18px, #3333ff 18px 24px, transparent 24px 32px) top / 32px 6px repeat-x,
      repeating-linear-gradient(90deg, #ff3333 0 6px, #ffcc00 6px 12px, #33ff33 12px 18px, #3333ff 18px 24px, transparent 24px 32px) bottom / 32px 6px repeat-x,
      repeating-linear-gradient(0deg, #ff3333 0 6px, #ffcc00 6px 12px, #33ff33 12px 18px, #3333ff 18px 24px, transparent 24px 32px) left / 6px 32px repeat-y,
      repeating-linear-gradient(0deg, #ff3333 0 6px, #ffcc00 6px 12px, #33ff33 12px 18px, #3333ff 18px 24px, transparent 24px 32px) right / 6px 32px repeat-y;
      animation: garlandSmooth 2s linear infinite;
      filter: brightness(0.85);
      }

      @keyframes garlandSmooth {
      0% { filter: brightness(0.35); }
      25% { filter: brightness(0.55); }
      50% { filter: brightness(1.15); }
      75% { filter: brightness(0.55); }
      100% { filter: brightness(0.35); }
      }

      .style-garland-snake::before {
      content: '';
      position: absolute;
      inset: 0;
      padding: 6px;
      box-sizing: border-box;
      pointer-events: none;
      z-index: 5;
      background:
      repeating-linear-gradient(90deg, rgba(255,51,51,.6) 0 6px, rgba(255,204,0,.6) 6px 12px, rgba(51,255,51,.6) 12px 18px, rgba(51,51,255,.6) 18px 24px, transparent 24px 36px) top left / 36px 6px repeat-x,
      repeating-linear-gradient(90deg, rgba(255,51,51,.6) 0 6px, rgba(255,204,0,.6) 6px 12px, rgba(51,255,51,.6) 12px 18px, rgba(51,51,255,.6) 18px 24px, transparent 24px 36px) bottom left / 36px 6px repeat-x,
      repeating-linear-gradient(0deg, rgba(255,51,51,.6) 0 6px, rgba(255,204,0,.6) 6px 12px, rgba(51,255,51,.6) 12px 18px, rgba(51,51,255,.6) 18px 24px, transparent 24px 36px) top left / 6px 36px repeat-y,
      repeating-linear-gradient(0deg, rgba(255,51,51,.6) 0 6px, rgba(255,204,0,.6) 6px 12px, rgba(51,255,51,.6) 12px 18px, rgba(51,51,255,.6) 18px 24px, transparent 24px 36px) top right / 6px 36px repeat-y,
      repeating-linear-gradient(90deg, rgba(255,255,255,.9) 0 12px, transparent 12px 72px) top left / 72px 6px repeat-x,
      repeating-linear-gradient(90deg, rgba(255,255,255,.9) 0 12px, transparent 12px 72px) bottom left / 72px 6px repeat-x,
      repeating-linear-gradient(0deg, rgba(255,255,255,.9) 0 12px, transparent 12px 72px) top left / 6px 72px repeat-y,
      repeating-linear-gradient(0deg, rgba(255,255,255,.9) 0 12px, transparent 12px 72px) top right / 6px 72px repeat-y,
      repeating-linear-gradient(90deg, rgba(0,0,0,.45) 0 14px, transparent 14px 72px) top left / 72px 6px repeat-x,
      repeating-linear-gradient(90deg, rgba(0,0,0,.45) 0 14px, transparent 14px 72px) bottom left / 72px 6px repeat-x,
      repeating-linear-gradient(0deg, rgba(0,0,0,.45) 0 14px, transparent 14px 72px) top left / 6px 72px repeat-y,
      repeating-linear-gradient(0deg, rgba(0,0,0,.45) 0 14px, transparent 14px 72px) top right / 6px 72px repeat-y;
      animation: garlandSnake 2s linear infinite;
      background-blend-mode: normal, normal, normal, normal, screen, screen, screen, screen, multiply, multiply, multiply, multiply;
      }

      @keyframes garlandSnake {
      0% { background-position: 0 0, 0 100%, 0 0, 100% 0, 0 0, 0 100%, 0 0, 100% 0, -72px 0, -72px 100%, 0 -72px, 100% -72px; }
      100% { background-position: 0 0, 0 100%, 0 0, 100% 0, 72px 0, 72px 100%, 0 72px, 100% 72px, 0 0, 0 100%, 0 0, 100% 0; }
      }

      #nyv-settings-btn {
      position: fixed;
      bottom: 20px;
      left: 20px;
      width: 40px;
      height: 40px;
      background: none;
      border: none;
      cursor: pointer;
      z-index: 10000;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 32px;
      transition: transform 0.2s;
      user-select: none;
      filter: drop-shadow(0 2px 8px rgba(0,0,0,0.3));
      }
      #nyv-settings-btn:hover {
      transform: scale(1.15);
      }

      #nyv-settings-modal {
      position: fixed;
      bottom: 70px;
      left: 20px;
      z-index: 10001;
      display: none;
      }
      #nyv-settings-modal.active {
      display: block;
      }

      #nyv-settings-panel {
      background: linear-gradient(135deg, #1a3a1a 0%, #0d1f0d 100%);
      border: 2px solid #4a7c23;
      border-radius: 12px;
      padding: 20px;
      width: 320px;
      max-height: 70vh;
      overflow-y: auto;
      box-shadow: 0 8px 32px rgba(0,0,0,0.5), 0 0 0 1px rgba(74, 124, 35, 0.3);
      color: #fff;
      }

      #nyv-settings-panel h2 {
      margin: 0 0 15px 0;
      font-size: 20px;
      color: #7fc843;
      text-align: center;
      text-shadow: 0 0 10px rgba(127, 200, 67, 0.5);
      }

      .nyv-setting-item {
      margin-bottom: 15px;
      padding-bottom: 15px;
      border-bottom: 1px solid rgba(74, 124, 35, 0.3);
      }

      .nyv-setting-item:last-child {
      border-bottom: none;
      }

      .nyv-checkbox-item {
      display: flex;
      align-items: center;
      gap: 10px;
      cursor: pointer;
      padding: 6px;
      border-radius: 6px;
      transition: background 0.2s;
      }

      .nyv-checkbox-item:hover {
      background: rgba(74, 124, 35, 0.2);
      }

      .nyv-checkbox {
      width: 18px;
      height: 18px;
      border: 2px solid #4a7c23;
      border-radius: 4px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      }

      .nyv-checkbox.checked::after {
      content: '✓';
      color: #7fc843;
      font-size: 14px;
      font-weight: bold;
      }

      .nyv-label {
      font-size: 13px;
      }

      .nyv-color-controls {
      display: grid;
      gap: 12px;
      }

      .nyv-color-item {
      display: flex;
      align-items: center;
      gap: 10px;
      }

      .nyv-color-item label {
      min-width: 70px;
      font-size: 12px;
      }

      .nyv-color-item input[type="color"] {
      width: 50px;
      height: 30px;
      border: none;
      border-radius: 6px;
      cursor: pointer;
      }

      .nyv-slider-item {
      display: flex;
      flex-direction: column;
      gap: 6px;
      }

      .nyv-slider-label {
      display: flex;
      justify-content: space-between;
      font-size: 12px;
      }

      .nyv-slider {
      width: 100%;
      height: 6px;
      border-radius: 3px;
      background: #333;
      outline: none;
      -webkit-appearance: none;
      }

      .nyv-slider::-webkit-slider-thumb {
      -webkit-appearance: none;
      width: 16px;
      height: 16px;
      border-radius: 50%;
      background: #4a7c23;
      cursor: pointer;
      }

      .nyv-slider::-moz-range-thumb {
      width: 16px;
      height: 16px;
      border-radius: 50%;
      background: #4a7c23;
      cursor: pointer;
      border: none;
      }

      #nyv-garland-type {
      width: 100%;
      padding: 8px 10px;
      border-radius: 4px;
      border: 1px solid #4a7c23;
      background: #333;
      color: #fff;
      font-size: 13px;
      cursor: pointer;
      transition: border-color 0.2s;
      }

      #nyv-garland-type:hover {
      border-color: #7fc843;
      }

      #nyv-garland-type:focus {
      outline: none;
      border-color: #7fc843;
      box-shadow: 0 0 4px rgba(127, 200, 67, 0.3);
      }

      #nyv-garland-type option {
      background: #333;
      color: #fff;
      }

      .nyv-buttons {
      display: flex;
      gap: 8px;
      margin-top: 15px;
      }

      .nyv-btn {
      flex: 1;
      padding: 10px;
      border: none;
      border-radius: 8px;
      cursor: pointer;
      font-size: 13px;
      font-weight: bold;
      transition: opacity 0.2s;
      }

      .nyv-btn:hover {
      opacity: 0.8;
      }

      .nyv-btn-reset {
      background: #c0392b;
      color: #fff;
      }

      .nyv-btn-close {
      background: #4a7c23;
      color: #fff;
      }

      #nyv-settings-panel::-webkit-scrollbar {
      width: 8px;
      }

      #nyv-settings-panel::-webkit-scrollbar-track {
      background: rgba(0,0,0,0.3);
      border-radius: 4px;
      }

      #nyv-settings-panel::-webkit-scrollbar-thumb {
      background: #4a7c23;
      border-radius: 4px;
      }

      #nyv-settings-panel::-webkit-scrollbar-thumb:hover {
      background: #5a9c33;
      }
      `;

      const headObserver = new MutationObserver(() => {
      if (document.head) {
      document.head.appendChild(style);
      headObserver.disconnect();
      }
      });
      headObserver.observe(document.documentElement, { childList: true });

      let snowInterval = null;

      function updateCandyColors() {
      const color1 = settings.candyColor1;
      const color2 = settings.candyColor2;
      const opacity = settings.candyOpacity;
      const brightness = settings.candyBrightness;

      const rgb1 = hexToRgb(color1);
      const rgb2 = hexToRgb(color2);

      const root = document.documentElement.style;
      root.setProperty('--nyv-candy-c1', `${rgb1.r},${rgb1.g},${rgb1.b}`);
      root.setProperty('--nyv-candy-c2', `${rgb2.r},${rgb2.g},${rgb2.b}`);
      root.setProperty('--nyv-candy-opacity', opacity);
      root.setProperty('--nyv-candy-brightness', brightness);
      }

      function hexToRgb(hex) {
      const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
      return result ? {
      r: parseInt(result[1], 16),
      g: parseInt(result[2], 16),
      b: parseInt(result[3], 16)
      } : { r: 255, g: 100, b: 100 };
      }

      function initSnow() {
      if (snowInterval) {
      clearInterval(snowInterval);
      snowInterval = null;
      }

      if (!settings.snow) {
      document.querySelectorAll('.snowflake').forEach(el => el.remove());
      return;
      }

      const getInterval = () => {
      const amount = settings.snowAmount;
      if (amount <= 0) return 10000;
      return Math.max(50, Math.floor(10000 / amount));
      };

      const spawnSnowflake = () => {
      const el = document.createElement('div');
      el.className = 'snowflake';
      el.innerHTML = '';
      el.style.left = Math.random() * 100 + 'vw';

      const speedFactor = settings.snowSpeed / 5;
      const baseDuration = Math.random() * 7 + 5;
      const duration = baseDuration / speedFactor;

      el.style.animationDuration = duration + 's';

      const sizeRange = settings.snowSizeMax - settings.snowSizeMin;
      const size = settings.snowSizeMin + Math.random() * sizeRange;
      el.style.fontSize = size + 'px';

      el.style.opacity = Math.random() * 0.7 + 0.3;
      document.body.appendChild(el);
      setTimeout(() => el.remove(), duration * 1000);
      };

      snowInterval = setInterval(spawnSnowflake, getInterval());
      }

      function safeReplaceText(element, searchText, replaceText) {
      if (!settings.textReplace) return;
      if (!element.textContent.includes(searchText)) return;
      const walker = document.createTreeWalker(element, NodeFilter.SHOW_TEXT, null, false);
      let node;
      while (node = walker.nextNode()) {
      if (node.nodeValue.includes(searchText)) {
      node.nodeValue = node.nodeValue.replace(new RegExp(searchText, 'g'), replaceText);
      }
      }
      }

      function spawnFrostDrops(block) {
      if (!settings.frostyHeaders) return;
      const width = block.offsetWidth || 300;
      const count = Math.floor(width / 35);
      for (let i = 0; i < count; i++) {
      const d = document.createElement('div');
      d.className = 'frost-drop';
      d.style.left = (Math.random() * 94 + 3) + '%';
      d.style.animation = `frostDripAnim ${Math.random()*2+3}s ease-in-out infinite ${Math.random()*5}s`;
      block.appendChild(d);
      }
      }

      function spawnImgDrops(block) {
      if (!settings.fluffyStyle) return;
      const width = block.offsetWidth || 300;
      const count = Math.floor(width / 50);
      for (let i = 0; i < count; i++) {
      const img = document.createElement('img');
      img.src = imgDropSrc;
      img.className = 'img-drop';
      img.style.left = (Math.random() * 90 + 5) + '%';
      img.style.animation = `imgDripAnim ${Math.random()*3+4}s ease-in infinite ${Math.random()*5}s`;
      block.appendChild(img);
      }
      }

      const resizeObserver = new ResizeObserver((entries) => {
      for (let entry of entries) {
      requestAnimationFrame(() => createGarland(entry.target));
      }
      });

      function createGarland(block) {
      if (!settings.garland) return;
      block.querySelectorAll('.garland-bulb').forEach(b => b.remove());

      const w = block.offsetWidth;
      const h = block.offsetHeight;
      if (h === 0) return;

      const offset = -6;
      const spacing = 14;
      const colors = ['bulb-red', 'bulb-gold', 'bulb-green', 'bulb-blue'];
      let colorIdx = 0;

      const addBulb = (t, l, r, b) => {
      const bulb = document.createElement('div');
      bulb.className = `garland-bulb ${colors[colorIdx++ % 4]}`;
      if (t !== null) bulb.style.top = t + 'px';
      if (l !== null) bulb.style.left = l + 'px';
      if (r !
     
    This article was useful for you?
    You can thank the author of the topic by transferring funds to your balance
    Thank the author
  2. Нинтендо
    Нинтендо Dec 30, 2025 контакты - неактуальны. связь только лс форума 9,130 Sep 12, 2021
    ахах такой колхоз, но такой сука вайбовый
     
  3. karandawww
    не будет лагать от дополнений таких?
     
    1. Dimeria Topic starter
      avatarkarandawww , а тут уже комп даст ответ :) там в основном гирлянды хавает из-за дум элементов , есть и оптимизированные варианты , в настройках
Loading...