1. Nachrichten
  2. Forum
    1. Unerledigte Themen
    2. Forenregeln
  3. Spenden
  • Anmelden
  • Registrieren
  • Suche
Alles
  • Alles
  • Artikel
  • Seiten
  • Forum
  • Erweiterte Suche
  1. camp-firefox.de
  2. Mira_Belle

Beiträge von Mira_Belle

  • Suche Lösung per CSS oder JS damit sich die Menüs "soft" öffnen.

    • Mira_Belle
    • 3. Juli 2025 um 22:17
    Zitat von Mira_Belle

    Werde ich so gleich mal ausprobieren!

    Habe ich,
    und die Untermenüs funktionieren so nicht!

    Aber so:

    CSS
        #main-menubar > menu > menupopup { 
            opacity: 0 !important;  
            transform: translateY(-100%) !important;  
        }
    
        #main-menubar > menu[open] > menupopup { 
            opacity: 1 !important;     
            transform: translateY(0) !important;  
            transition: transform 0.8s ease, opacity 0.3s ease !important;  
        }
    
        #main-menubar > menu menu > menupopup { 
            opacity: 0 !important;  
            transform: translateX(-100%) !important;  
        }
        #main-menubar > menu menu[open] > menupopup { 
            opacity: 1 !important;     
            transform: translateX(0) !important;  
            transition: transform 0.8s ease, opacity 0.3s ease !important;  
        } 
    Alles anzeigen

    Aber Danke für die Vorlage:!:
    Ist viel einfacher als:

    CSS
        #file-menu > menupopup,     /* Datei */
        #edit-menu > menupopup,     /* Bearbeiten */
        #view-menu > menupopup,     /* Ansicht */
        #history-menu > menupopup,  /* Chronik */
        #bookmarksMenu > menupopup, /* Lesezeichen */
        #tools-menu > menupopup,    /* Extras */
        #helpMenu > menupopup       /* Hilfe */
        {
            opacity: 0 !important;  
            transform: translateY(-100%) !important;  
        }
        #file-menu[open] > menupopup,       /* Datei */ 
        #edit-menu[open] > menupopup,       /* Bearbeiten */
        #view-menu[open] > menupopup,       /* Ansicht */
        #history-menu[open] > menupopup,    /* Chronik */
        #bookmarksMenu[open] > menupopup,   /* Lesezeichen */
        #tools-menu[open] > menupopup,      /* Extras */
        #helpMenu[open] > menupopup         /* Hilfe */
        { 
            opacity: 1 !important;     
            transform: translateY(0) !important;  
            transition: transform 0.8s ease, opacity 0.3s ease !important;  
        }
    
        #file-menu menu > menupopupp,    /* Datei */
        #edit-menu menu > menupopupp,    /* Bearbeiten */
        #view-menu menu > menupopup,     /* Ansicht */
        #history-menu menu > menupopup,  /* Chronik */
        #bookmarksMenu menu > menupopup, /* Lesezeichen */
        #tools-menu menu > menupopup,    /* Extras */
        #helpMenu menu > menupopup       /* Hilfe */
        { 
            opacity: 0 !important;  
            transform: translateX(-100%) !important;  
        }
        #file-menu menu[open] > menupopup,     /* Datei */
        #edit-menu menu[open] > menupopup,     /* Bearbeiten */
        #view-menu menu[open] > menupopup,     /* Ansicht */
        #history-menu menu[open] > menupopup,  /* Chronik */
        #bookmarksMenu menu[open] > menupopup, /* Lesezeichen */
        #tools-menu menu[open] > menupopup,    /* Extras */
        #helpMenu menu[open] > menupopup       /* Hilfe */
        { 
            margin-left: 6px !important;
            opacity: 1 !important;     
            transform: translateX(0) !important;  
            transition: transform 0.8s ease, opacity 0.3s ease !important;  
        }
    Alles anzeigen


    Ach und das Menü "Profile" ist dann ja auch gleich mit dabei.

  • Suche Lösung per CSS oder JS damit sich die Menüs "soft" öffnen.

    • Mira_Belle
    • 3. Juli 2025 um 22:08

    2002Andreas Das hat aber lange gedauert bis Du hier eingeschritten bist. :D

    Aber Sören war auch schon da und hat erklärt, warum will-change: transform, opacity !important; nicht genutzt werden soll.

    Also:


    CSS
    #main-menubar > menu > menupopup { 
        opacity: 0 !important;  
        transform: translateY(-100%) !important;  
    }
    
    #main-menubar > menu[open] > menupopup { 
        opacity: 1 !important;     
        transform: translateY(0) !important;  
        transition: transform 1.5s ease, opacity 1.5s ease !important;  
    }
    
    #main-menubar > menu > menupopup { 
        opacity: 0 !important;  
        transform: translateX(-100%) !important;  
    }
    #main-menubar > menu[open] > menupopup { 
        opacity: 1 !important;     
        transform: translateX(0) !important;  
        transition: transform 1.5s ease, opacity 1.5s ease !important;  
    } 
    Alles anzeigen


    Werde ich so gleich mal ausprobieren!

  • Suche Lösung per CSS oder JS damit sich die Menüs "soft" öffnen.

    • Mira_Belle
    • 3. Juli 2025 um 21:18

    Menüleistenbuttons? Was genau ist damit gemeint?
    Datei ... Bearbeiten ... Ansicht ... Chronik ... Lesezeichen ... Extras ... Hilfe ?
    Hatten wir schon.

    Code
    #file-menu
    #edit-menu
    #view-menu
    #history-menu
    #bookmarksMenu
    #profiles-menu
    #tools-menu
    #helpMenu

    Das sind, inkl. "Profile", jene Selektoren.


    Und das Hamburgermenü.

  • Suche Lösung per CSS oder JS damit sich die Menüs "soft" öffnen.

    • Mira_Belle
    • 2. Juli 2025 um 21:15
    Zitat von FuchsFan

    Hast du gut gemacht. :thumbup:



    Was?
    Die ganze Arbeit hatte doch Horstmann:!:

  • Suche Lösung per CSS oder JS damit sich die Menüs "soft" öffnen.

    • Mira_Belle
    • 2. Juli 2025 um 08:26

    mkpcxxl Danke für den Tipp mit dem Autopopup_Menus.uc.js
    Habe es für mich ergänzt, damit auch "mein" Appmenü damit funktioniert.

    Einfach klasse. Drüberfahren und die Menüs öffnen sich von alleine.


    Ach und noch etwas:!:
    Ich hatte lediglich die Idee.
    Der gebührende Dank geht an Horstmann,
    der hatte die Ideen zur Umsetzung in Code:!:
    Ich habe nur getestet und die CSS-Fragmente zusammen gesetzt.

    Bedankt Euch also nicht bei mir, sondern bei Horstmann:!:

  • Suche Lösung per CSS oder JS damit sich die Menüs "soft" öffnen.

    • Mira_Belle
    • 1. Juli 2025 um 19:53

    Ich habe da mal was zusammengeschustert!
    Funktioniert bei mir zufriedenstellend.

    CSS
    #file-menu > menupopup,     /* Datei */
    #edit-menu > menupopup,     /* Bearbeiten */
    #view-menu > menupopup,     /* Ansicht */
    #history-menu > menupopup,  /* Chronik */
    #bookmarksMenu > menupopup, /* Lesezeichen */
    #tools-menu > menupopup,    /* Extras */
    #helpMenu > menupopup       /* Hilfe */
    {
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateY(-100%) !important;  
    }
    #file-menu[open] > menupopup,       /* Datei */ 
    #edit-menu[open] > menupopup,       /* Bearbeiten */
    #view-menu[open] > menupopup,       /* Ansicht */
    #history-menu[open] > menupopup,    /* Chronik */
    #bookmarksMenu[open] > menupopup,   /* Lesezeichen */
    #tools-menu[open] > menupopup,      /* Extras */
    #helpMenu[open] > menupopup         /* Hilfe */
    { 
        opacity: 1 !important;     
        transform: translateY(0) !important;  
        transition: transform 0.8s ease, opacity 0.3s ease !important;  
    }
    
    #file-menu menu > menupopupp,    /* Datei */
    #edit-menu menu > menupopupp,    /* Bearbeiten */
    #view-menu menu > menupopup,     /* Ansicht */
    #history-menu menu > menupopup,  /* Chronik */
    #bookmarksMenu menu > menupopup, /* Lesezeichen */
    #tools-menu menu > menupopup,    /* Extras */
    #helpMenu menu > menupopup       /* Hilfe */
    { 
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateX(-100%) !important;  
    }
    
    #file-menu menu[open] > menupopup,     /* Datei */
    #edit-menu menu[open] > menupopup,     /* Bearbeiten */
    #view-menu menu[open] > menupopup,     /* Ansicht */
    #history-menu menu[open] > menupopup,  /* Chronik */
    #bookmarksMenu menu[open] > menupopup, /* Lesezeichen */
    #tools-menu menu[open] > menupopup,    /* Extras */
    #helpMenu menu[open] > menupopup       /* Hilfe */
    { 
        margin-left: 6px !important;
        opacity: 1 !important;     
        transform: translateX(0) !important;  
        transition: transform 0.8s ease, opacity 0.3s ease !important;  
    }
    
    /* Appmenü */
    #AppMenuButton > menupopup {
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateY(-100%) !important;  
    }
    #AppMenuButton[open] > menupopup {
        opacity: 1 !important;     
        transform: translateY(0) !important;  
        transition: transform 0.8s ease, opacity 0.3s ease !important;  
    } 
    
    #AppMenuButton menu > menupopupp { 
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateX(-100%) !important;  
    }
    #AppMenuButton menu[open] > menupopup{ 
        margin-left: 6px !important;
        margin-top: -7px !important;
        opacity: 1 !important;     
        transform: translateX(0) !important;  
        transition: transform 0.8s ease, opacity 0.3s ease !important;  
    }
    
    /* Ausrichtung der Untermenüs in Ansicht */
    #viewToolbarsMenu > menupopup,
    #viewSidebarMenuMenu > menupopup,
    #viewFullZoomMenu > menupopup,
    #pageStyleMenu > menupopup {
        margin-left: 6px !important;
        margin-top: -7px !important;
    }
    Alles anzeigen

    Das mit der Leerstelle ist mit Absicht.
    Irgendwie ist bei mit der kleine Pfeil zu weit links, bsw. die Breite der "Schaltfläche" stimmt nicht.
    Da muss ich mal sehen, welches CSS mir dazwischen haut.

    Fehler gefunden, CSS korrigiert.

    mkpcxxl oder Endor
    Bezüglich der Lesezeichenleiste hoffe ich ja, dass jemand einen Thread aufmacht.

  • Suche Lösung per CSS oder JS damit sich die Menüs "soft" öffnen.

    • Mira_Belle
    • 1. Juli 2025 um 18:22

    So geht es!

    CSS
    /* Lesezeichen */
    #bookmarksMenu > menupopup {
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateY(-100%) !important;  
    }
    #bookmarksMenu[open] > menupopup { 
        opacity: 1 !important;     
        transform: translateY(0) !important;  
        transition: transform 0.8s ease, opacity 0.3s ease !important;  
    } 
    #bookmarksMenu menu > menupopup { 
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateX(-100%) !important;  
    }
    #bookmarksMenu menu[open] > menupopup { 
        opacity: 1 !important;     
        transform: translateX(0) !important;  
        transition: transform 0.8s ease, opacity 0.3s ease !important;  
    }
    Alles anzeigen
  • Suche Lösung per CSS oder JS damit sich die Menüs "soft" öffnen.

    • Mira_Belle
    • 1. Juli 2025 um 16:57
    Zitat von Horstmann

    Aber nur bei den Untermenus von #view-menu, ist das so gewollt? :/

    Bis auf Ansicht und die Lesezeichen haben die anderen Menüs keine solchen Untermenüs.
    Und bei den Lesezeichen scheitere ich kläglich, obwohl Du so tolle Vorarbeit geleistet hast.

  • Suche Lösung per CSS oder JS damit sich die Menüs "soft" öffnen.

    • Mira_Belle
    • 1. Juli 2025 um 16:52

    Und schon wieder brauche ich Hilfe.

    Mist, bei den Lesezeichen greift der untere Teil des CSS nicht.

    CSS
    /* Lesezeichen */
    #bookmarksMenu menupopup {
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateY(-100%) !important;  
    }
    #bookmarksMenu[open] menupopup { 
        opacity: 1 !important;     
        transform: translateY(0) !important;  
        transition: transform 0.8s ease, opacity 0.3s ease !important;  
    } 
    /* ----------------------------------------------------------------------- */
    #bookmarksMenu menu > menupopup { 
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateX(-100%) !important;  
    }
    #bookmarksMenu menu[open] > menupopup { 
        opacity: 1 !important;     
        transform: translateX(0) !important;  
        transition: transform 0.8s ease, opacity 0.3s ease !important;  
    }
    /* ----------------------------------------------------------------------- */
    Alles anzeigen
  • Suche Lösung per CSS oder JS damit sich die Menüs "soft" öffnen.

    • Mira_Belle
    • 1. Juli 2025 um 16:36

    grisu2099 Du hast teilweise recht! Danke.

    So ist es schon besser und dass die Untermenüs eben auch von links nach rechts aufscrollen.

    CSS
      /* Menüs der Menüleiste von oben nach unten */
      	#file-menu menupopup,
    	#edit-menu menupopup,
    	#view-menu > menupopup,
    	#history-menu menupopup,
    	#bookmarksMenu menupopup,
    	#tools-menu menupopup,
    	#helpMenu menupopup {
    		will-change: transform, opacity !important;  
    		opacity: 0 !important;  
    		transform: translateY(-100%) !important;
    	}	
    	#file-menu[open] menupopup,
    	#edit-menu[open] menupopup,
    	#view-menu[open] > menupopup,
    	#history-menu[open] menupopup,
    	#bookmarksMenu[open] menupopup,
    	#tools-menu[open] menupopup,
    	#helpMenu[open] menupopup { 
    		opacity: 1 !important;     
    		transform: translateY(0) !important;  
    		transition: transform 0.8s ease, opacity 0.3s ease !important;  
    	}
      /* Untermenüs "Ansicht" von links nach rechts */
      	#view-menu menu > menupopup { 
        	will-change: transform, opacity !important;  
        	opacity: 0 !important;  
        	transform: translateX(-100%) !important;  
      	}
      	#view-menu menu[open] > menupopup { 
        	opacity: 1 !important;     
        	transform: translateX(0) !important;  
        	transition: transform 0.8s ease, opacity 0.3s ease !important;  
      	}
      /* Ausrichtung der Untermenüs in Ansicht */
    	#viewToolbarsMenu menupopup,
    	#viewSidebarMenuMenu menupopup,
    	#viewFullZoomMenu menupopup,
    	#pageStyleMenu menupopup {
    		margin-left: 6px !important;
    		margin-top: -7px !important;
    	}
    Alles anzeigen
  • Suche Lösung per CSS oder JS damit sich die Menüs "soft" öffnen.

    • Mira_Belle
    • 1. Juli 2025 um 15:29

    Dank Horstmann hier das komplette CSS für das animierte Öffnen der Menüs.

    CSS
    /* Datei */
    #file-menu menupopup {
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateY(-100%) !important;  
    }
    #file-menu[open] menupopup { 
        opacity: 1 !important;     
        transform: translateY(0) !important;  
        transition: transform 0.8s ease, opacity 0.3s ease !important;  
    }
    
    /* Bearbeiten */
    #edit-menu menupopup {
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateY(-100%) !important;  
    }
    #edit-menu[open] menupopup { 
        opacity: 1 !important;     
        transform: translateY(0) !important;  
        transition: transform 0.8s ease, opacity 0.3s ease !important;  
    }
    
    /* Ansicht, inkl. Untermenü */
    #view-menu > menupopup {
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateY(-100%) !important;  
    }
    
    #view-menu[open] > menupopup { 
        opacity: 1 !important;     
        transform: translateY(0) !important;  
        transition: transform 0.8s ease, opacity 0.3s ease !important;  
    }
    
    #view-menu menu > menupopup { 
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateX(-100%) !important;  
    }
    #view-menu menu[open] > menupopup { 
        opacity: 1 !important;     
        transform: translateX(0) !important;  
        transition: transform 0.8s ease, opacity 0.3s ease !important;  
    } 
    
    /* Chronik */
    #history-menu menupopup {
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateY(-100%) !important;  
    }
    #history-menu[open] menupopup { 
        opacity: 1 !important;     
        transform: translateY(0) !important;  
        transition: transform 0.8s ease, opacity 0.3s ease !important;  
    } 
    
    /* Lesezeichen */
    #bookmarksMenu menupopup {
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateY(-100%) !important;  
    }
    #bookmarksMenu[open] menupopup { 
        opacity: 1 !important;     
        transform: translateY(0) !important;  
        transition: transform 0.8s ease, opacity 0.3s ease !important;  
    } 
    
    /* Extras */
    #tools-menu menupopup {
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateY(-100%) !important;  
    }
    #tools-menu[open] menupopup { 
        opacity: 1 !important;     
        transform: translateY(0) !important;  
        transition: transform 0.8s ease, opacity 0.3s ease !important;  
    } 
    
    /* Hilfe */
    #helpMenu menupopup {
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateY(-100%) !important;  
    }
    #helpMenu[open] menupopup { 
        opacity: 1 !important;     
        transform: translateY(0) !important;  
        transition: transform 0.8s ease, opacity 0.3s ease !important;  
    } 
    
    /* Ausrichtung der Untermenüs in Ansicht */
    #viewToolbarsMenu menupopup {
        margin-left: 6px !important;
        margin-top: -7px !important;
    }
    #viewSidebarMenuMenu menupopup {
        margin-left: 6px !important;
        margin-top: -7px !important;
    }
    #viewFullZoomMenu menupopup {
        margin-left: 6px !important;
        margin-top: -7px !important;
    }
    #pageStyleMenu menupopup {
        margin-left: 6px !important;
        margin-top: -7px !important;
    }
    Alles anzeigen

    Der untere Teil, das Ausrichten der Untermenüs in Ansicht, wird nicht zwingend benötigt!

    Ob es noch ein JS geben wird, damit schon beim "Hovern" die Menüs sich öffnen, ich weiß es nicht!

  • Suche Lösung per CSS oder JS damit sich die Menüs "soft" öffnen.

    • Mira_Belle
    • 1. Juli 2025 um 15:09

    Treffer! Ich danke Dir.

    CSS
    #view-menu > menupopup {
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateY(-100%) !important;  
    }
    
    #view-menu[open] > menupopup { 
        opacity: 1 !important;     
        transform: translateY(0) !important;  
        transition: transform 1.5s ease, opacity 1.5s ease !important;  
    }
    
    #view-menu menu > menupopup { 
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateX(-100%) !important;  
    }
    #view-menu menu[open] > menupopup { 
        opacity: 1 !important;     
        transform: translateX(0) !important;  
        transition: transform 1.5s ease, opacity 1.5s ease !important;  
    }
    Alles anzeigen
  • Suche Lösung per CSS oder JS damit sich die Menüs "soft" öffnen.

    • Mira_Belle
    • 1. Juli 2025 um 10:15

    Grrrr.
    Das will alles nicht.
    Der erste CSS-Block sollte das Menü, bzw. Popup ausblenden.
    Ich habe nun folgende Selektoren für das erste Popup unter "Ansicht/Symbolleisten" ausprobiert:

    #viewToolbarsMenu => nichts!
    #view-menu-popup => nichts!

    #viewToolbarsMenu > menupopup => nichts
    aus Verzweiflung auch
    #view-menu-popup > menupopup
    ausprobiert, Fehlanzeige!


    Der Rest sah wie folgt aus:

    CSS
    {
       will-change: transform, opacity !important;  
       opacity: 0 !important;  
       transform: translateX(-100%) !important;  
    }

    Im Augenblick weiß ich nicht weiter und kann auch erst heute Abend weiter machen.

    Horstmann Aber ein ganz dickes Lob mal an Dich!
    Du gibst Dir soviel Mühe, vielen lieben Dank dafür.

    Ich kann zwar die Popups wie folgt ansprechen, um die Position zu korrigieren,
    aber das mit dem "Verbergen" will nicht!

    CSS
    #viewToolbarsMenu menupopup {
        margin-left: 6px !important;
        margin-top: -7px !important;
    }
    #viewSidebarMenuMenu menupopup {
        margin-left: 6px !important;
        margin-top: -7px !important;
    }
    #viewFullZoomMenu menupopup {
        margin-left: 6px !important;
        margin-top: -7px !important;
    }
    #pageStyleMenu menupopup {
        margin-left: 6px !important;
        margin-top: -7px !important;
    }
    Alles anzeigen

    -----------------------------------------------------------------------------------------------------------------------------------------------------
    Nachtrag!

    Auch ...

    CSS
    #viewToolbarsMenu > menupopup {
        margin-left: 6px !important;
        margin-top: -7px !important;
    }

    ... funktioniert.


    Und ...

    CSS
    #view-menu-popup  {
        margin-left: 6px !important;
        margin-top: -7px !important;
    }

    Ebenso!

  • Suche Lösung per CSS oder JS damit sich die Menüs "soft" öffnen.

    • Mira_Belle
    • 1. Juli 2025 um 08:54

    Also, die Menüs öffnen sich nun animiert, d.h. sie scrollen langsam von oben nach unten.
    Jedoch ist da noch das "Ansichtenmenü". Die Untermenüs poppen nach wie vor einfach auf.
    Werde noch einmal nach Horsmann's Anregung auf die Suche nach den richtigen Parametern der Selektoren gehen.

  • Suche Lösung per CSS oder JS damit sich die Menüs "soft" öffnen.

    • Mira_Belle
    • 30. Juni 2025 um 23:55
    Zitat von mkpcxxl

    Sensationell, ich liebe diese Animationen. Wäre es noch möglich, die gleichen Animationen bei der Lesezeichen Symbolleiste hin zu bekommen ? Dann wäre es perfekt für mich.

    Bestimmt, aber später. Verfolge einfach dieses Thema weiter.

  • Suche Lösung per CSS oder JS damit sich die Menüs "soft" öffnen.

    • Mira_Belle
    • 30. Juni 2025 um 23:38
    Zitat von Mira_Belle

    Geht das Scrollen auch von links nach rechts?

    Der Hintergrund dieser Frage war/ist das Ansichtenmenü!
    Habe mich belesen und "translateY" muss einfach nur in "translateX" geändert werden.

    Aber wieder einmal will der Code (das CSS) nicht so, wie ich will!

    Für "Symbolleisten" in "Ansicht".

    CSS
    #viewToolbarsMenu menupopup { 
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateX(-100%) !important;  
    }
    #viewToolbarsMenu[open] menupopup { 
        opacity: 1 !important;     
        transform: translateX(0) !important;  
        transition: transform 1.5s ease, opacity 1.5s ease !important;  
    } 

    Aber funktioniert gar nicht! Nicht einmal "unsichtbar" wird das "Popup".

  • Suche Lösung per CSS oder JS damit sich die Menüs "soft" öffnen.

    • Mira_Belle
    • 30. Juni 2025 um 22:50

    Du bist ein Orakel!
    Hier der CSS-Code der wunderbar funktioniert.

    CSS
    #file-menu menupopup {
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateY(-100%) !important;  
    }
    #file-menu[open] menupopup { 
        opacity: 1 !important;     
        transform: translateY(0) !important;  
        transition: transform 1.5s ease, opacity 1.5s ease !important;  
    } 
    
    #edit-menu menupopup {
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateY(-100%) !important;  
    }
    #edit-menu[open] menupopup { 
        opacity: 1 !important;     
        transform: translateY(0) !important;  
        transition: transform 1.5s ease, opacity 1.5s ease !important;  
    }
    
    #view-menu menupopup {
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateY(-100%) !important;  
    }
    #view-menu[open] menupopup { 
        opacity: 1 !important;     
        transform: translateY(0) !important;  
        transition: transform 1.5s ease, opacity 1.5s ease !important;  
    }
    
    #history-menu menupopup {
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateY(-100%) !important;  
    }
    #history-menu[open] menupopup { 
        opacity: 1 !important;     
        transform: translateY(0) !important;  
        transition: transform 1.5s ease, opacity 1.5s ease !important;  
    } 
    
    #bookmarksMenu menupopup {
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateY(-100%) !important;  
    }
    #bookmarksMenu[open] menupopup { 
        opacity: 1 !important;     
        transform: translateY(0) !important;  
        transition: transform 1.5s ease, opacity 1.5s ease !important;  
    } 
    
    #tools-menu menupopup {
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateY(-100%) !important;  
    }
    #tools-menu[open] menupopup { 
        opacity: 1 !important;     
        transform: translateY(0) !important;  
        transition: transform 1.5s ease, opacity 1.5s ease !important;  
    } 
    
    #helpMenu menupopup {
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateY(-100%) !important;  
    }
    #helpMenu[open] menupopup { 
        opacity: 1 !important;     
        transform: translateY(0) !important;  
        transition: transform 1.5s ease, opacity 1.5s ease !important;  
    } 
    Alles anzeigen


    Jipi, und mit ....

    CSS
    #AppMenuButton menupopup {
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateY(-100%) !important;  
    }
    #AppMenuButton[open] menupopup { 
        opacity: 1 !important;     
        transform: translateY(0) !important;  
        transition: transform 1.5s ease, opacity 1.5s ease !important;  
    } 

    ... geht es auch im Appmenü!

    Mit den Werten für's scrollen (transform) werde ich noch etwas experimentieren.
    Für die Transparenz (opacity) habe ich mich schon auf 0.3s festgelegt.


    Geht das Scrollen auch von links nach rechts?

  • Suche Lösung per CSS oder JS damit sich die Menüs "soft" öffnen.

    • Mira_Belle
    • 30. Juni 2025 um 22:06

    Horstmann Vielen Dank für Deine Anregung, aber da ist nichts!

  • „Tab neu laden per Doppelklick“ auf den Tabreiter funktioniert nicht mehr

    • Mira_Belle
    • 30. Juni 2025 um 20:53

    Danke für die Rückmeldung.
    Schön, dass es jetzt so funktioniert, wie von Dir gewünscht.

  • Suche Lösung per CSS oder JS damit sich die Menüs "soft" öffnen.

    • Mira_Belle
    • 30. Juni 2025 um 20:51
    Zitat von BrokenHeart

    Lesezeichen-Menü über das Lesezeichen-Icon , welches man sich erst in die Navbar schieben muss.

    Ich habe es ausprobiert und es dürfte so ziemlich genau das sein, was du suchst. Für meinen Geschmack allerdings etwas zu viel Transparenz, aber sonst sieht es sehr gut aus :thumbup: .

    Ich auch, und es ist ziemlich genau so, wie ich es mir vorstelle.
    Der Code (das CSS) dazu:

    CSS
    #BMB_bookmarksPopup {
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateY(-100%) !important;  
    }
    
    #BMB_bookmarksPopup[animate="open"] {
        opacity: 1 !important;     
        transform: translateY(0) !important;  
        transition: transform 1.5s ease, opacity 1.5s ease !important;  
    }
    Alles anzeigen

    Das klappt wunderbar.

    Adaptiere ich diesen Code (CSS) auf die Menüs der Menüleiste, funktioniert es nicht!

    Zum Beispiel das Hilfemenü:

    CSS
    #menu_HelpPopup {
        will-change: transform, opacity !important;  
        opacity: 0 !important;  
        transform: translateY(-100%) !important;  
    }
    
    
    #menu_HelpPopup[animate="open"] {
        opacity: 1 !important;     
        transform: translateY(0) !important;  
        transition: transform 1.5s ease, opacity 1.5s ease !important;  
    }
    Alles anzeigen

    Das Menü erscheint erst gar nicht!
    So ist es auch bei allen anderen Menüs.

Unterstütze uns!

Jährlich (2025)

104,5 %

104,5% (679,10 von 650 EUR)

Jetzt spenden
  1. Kontakt
  2. Datenschutz
  3. Impressum
Community-Software: WoltLab Suite™
Mastodon