• Login
  • Register
  • Login Register
    Login
    Username/Email:
    Password:
    Or login with a social network below
  • Forum
  • Website
  • GitHub
  • Status
  • Translation
  • Features
  • Team
  • Rules
  • Help
  • Feeds
User Links
  • Login
  • Register
  • Login Register
    Login
    Username/Email:
    Password:
    Or login with a social network below

    Useful Links Forum Website GitHub Status Translation Features Team Rules Help Feeds
    Jellyfin Forum Support Themes & Styles CSS for Playerbar hide time

     
    • 0 Vote(s) - 0 Average

    CSS for Playerbar hide time

    Looking for custom CSS for Player bar.
    atma_weaponvi
    Offline

    Junior Member

    Posts: 12
    Threads: 3
    Joined: 2024 Jun
    Reputation: 0
    Country:Canada
    #1
    2024-10-18, 05:35 PM
    Hi community,

    I'm wondering if anyone had CSS that can change the speed at which the player bar hides itself? I would like the ability to speed up the auto hide function if possible.

    Warm Regards,
    Atma
    SethBacon
    Offline

    Member

    Posts: 51
    Threads: 3
    Joined: 2023 Nov
    Reputation: 5
    Country:Canada
    #2
    2024-10-21, 07:57 PM
    Sorry this is not a good answer for you, but ive been working on some similar tinkering and heres some thoughts. If you want to speed up the rate that the UI disappears that is changeable in CSS:
    /* Speed up transition for the skinHeader (top controls) */
    .skinHeader {
    transition: opacity 0.2s ease, transform 0.2s ease !important;
    }

    /* Speed up transition for the videoOsdBottom (bottom controls) */
    .videoOsdBottom {
    transition: opacity 0.2s ease, transform 0.2s ease !important;
    }

    /* Ensure hidden states also have reduced transition durations */
    .osdHeader-hidden,
    .videoOsdBottom-hidden,
    .hide {
    transition: opacity 0.2s ease, transform 0.2s ease !important;
    }


    But the actual length of time the UI stays up is on a 3 second javascript timer under the control of JF-web. Confusingly, JF plugins cannot adjust JF-Web behaviour, you would need to inject code either on your browser through something like tampermokey:

    // ==UserScript==
    // @name Jellyfin Auto-Hide Timer Modifier
    // @namespace http://tampermonkey.net/
    // @version 1.0
    // @description Reduce the auto-hide delay for Jellyfin player controls
    // @author Your Name
    // @match http://localhost:8096/* // Adjust the URL to match your Jellyfin server
    // @grant none
    // ==/UserScript==

    (function() {
    'use strict';

    // Wait for the page to load
    window.addEventListener('load', function() {
    // Function to override setTimeout
    const originalSetTimeout = window.setTimeout;
    window.setTimeout = function(callback, delay, ...args) {
    // If the delay is 3000ms, change it to 1000ms
    if (delay === 3000) {
    return originalSetTimeout(callback, 1000, ...args);
    }
    return originalSetTimeout(callback, delay, ...args);
    };
    }, false);
    })();
    which would work on that browser only,

    Or inject it into jfweb's index.html ala spotlight https://github.com/tedhinklater/Jellyfin...ontent-Bar and that would work for all users on desktop JMP or android (Not android-TV)
    « Next Oldest | Next Newest »

    Users browsing this thread: 1 Guest(s)


    • View a Printable Version
    • Subscribe to this thread
    Forum Jump:

    Home · Team · Help · Contact
    © Designed by D&D - Powered by MyBB
    L


    Jellyfin

    The Free Software Media System

    Linear Mode
    Threaded Mode