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. bege

Beiträge von bege

  • Symbole zu Kontextmenüs mit Javascript und CSS hinzufügen

    • bege
    • 14. Februar 2020 um 20:29
    Zitat von Endor

    Nur zur Erklärung, wenn dieser Eintrag auf true steht,

    dann kommt vor dem Öffnen der Browserwerkzeuge die Abfrage

    ob man das zulassen will. Durch setzen auf false kommt diese Abfrage nicht mehr.

    Ich hätte hier ein Script,welches eine Symbolleistenschaltfläche zum

    Öffnen der Browserwerkzeuge einbaut. Bei Bedarf schiebe ich das gern mal rüber.

    Mfg.
    Endor

    Alles anzeigen

    Ja, deshalb habe ich geschrieben, dass mir der Tipp tausend Klicks erspart hätte, hätte ich es früher gewusst. Aber jetzt liegt eine klickärmere Zukunft vor mir :D

    Und vielleicht verschlucken sich dann die Browser-Werkzeuge nicht mehr so oft - so habe ich deinen Tipp auch verstanden.

    Ich habe mich inzwischen an die Fingerverrenkung mit dem Shortcut gewöhnt, aber die Schaltfläche hätte ich trotzdem gern.

  • Symbole zu Kontextmenüs mit Javascript und CSS hinzufügen

    • bege
    • 14. Februar 2020 um 20:04
    Zitat von Endor

    Zu Browserwerkzeugen, was hast Du in about:config

    bei diesem Eintrag für einen Wert:

    devtools.debugger.prompt-connection

    true oder false?

    Wenn true mal auf false stellen und Firefox neu starten und testen.

    Mfg.
    Endor

    Alles anzeigen

    Wenn ich das ein paar Jahre früher gewusst hätte, hätte ich mir tausend Klicks sparen können :rolleyes:

    Ich werde es verfolgen und schauen, ob mir das auch das wiederholte Löschen des Ordners erspart.

    Vielen Dank für den Hinweis. :thumbup: :)

  • Symbole zu Kontextmenüs mit Javascript und CSS hinzufügen

    • bege
    • 14. Februar 2020 um 01:52
    Zitat von Endor

    Denk dran da sind Umlaute dabei, daher muss der CSS Code in UTF-8 gespeichert werden.

    Mfg.
    Endor

    Tja, das war's natürlich. Danke. Obwohl ich das weiß, passiert mir das immer wieder. Jetzt ist bei mir auch alles komplett.

    Nur die Kontextmenüs der Add-on- und der Skript-Buttons werden etwas zerschossen. So sieht das ohne deinen Code aus

    und so mit

    jeweils der dritte Eintrag von oben und von unten werden zerschossen.

    Beim unteren ist es Zeile 3037 in deinem Code

    CSS
    #mainPopupSet > menupopup:nth-child(-n+70) > menuitem:nth-child(15)[type="checkbox"]>.menu-iconic-left{

    beim oberen Zeile 2779

    Code
    #mainPopupSet > menupopup:nth-child(-n+70) > menuitem:nth-child(3) > .menu-iconic-text {

    Weißt du, wie man deinen Code auf die Entwicklerwerkzeuge beschränken kann?


    Was das mit den Browser-Werkzeugen auf sich hat, wusste ich gar nicht, danke für die Erklärung. Nur blöd, dass bei mir immer wieder diese Werkzeuge streiken und ich den Ordner löschen muss. Dazu mache ich ein separates Thema.

  • Symbole zu Kontextmenüs mit Javascript und CSS hinzufügen

    • bege
    • 13. Februar 2020 um 00:02
    Zitat von Endor

    Für das Kontextmenü der Entwickler Werkzeuge hätte ich was für dich:

    https://github.com/Endor8/CSS/blo…zeuge/Menus.css

    Symbole sind als Base64 Code integriert.

    Mfg.
    Endor

    So, nach dem Kampf mit den anderen Menüs habe ich diesen Code ausprobiert. Das sieht ja total professionell aus, alle Achtung!

    Drei Fragen:

    Kannst du noch Symbole für die Einträge "Einfügen" und "Pseudoklassen ändern" hinzufügen?

    Einige andere Menüeinträge werden bei mir dadurch zerschossen. Wie lautet die "@-moz-document url" der Entwickler-Werkzeuge, um den Wirkungsbereich einzugrenzen?

    Lässt sich das auch für die Browser-Werkzeuge anwenden?

  • Symbole zu Kontextmenüs mit Javascript und CSS hinzufügen

    • bege
    • 12. Februar 2020 um 22:13
    Zitat von Endor

    bege

    Meinst das Kontextmenü von Sternschaltfläche in about:addons?

    Wenn ja, ich habe das so angesprochen:

    CSS
    #page-options > panel-list:nth-child(1) > panel-item:nth-child(1)::before {
    content: '';
    display: block;
    width: 16px;
    height: 16px;
    background-image: url('https://raw.githubusercontent.com/Endor8/CSS/master/Icons/Bild5.png');
    background-size: 16px 16px !important;
    margin-left: 15px;
    margin-right: -31px;}
    
    
    #page-options > panel-list:nth-child(1) > panel-item:nth-child(2)::before {
    content: '';
    display: block;
    width: 16px;
    height: 16px;
    background-image: url('https://raw.githubusercontent.com/Endor8/CSS/master/Icons/Bild61.png');
    background-size: 16px 16px !important;
    margin-left: 15px;
    margin-right: -31px;}
    
    
    #page-options > panel-list:nth-child(1) > panel-item:nth-child(4)::before {
    content: '';
    display: block;
    width: 16px;
    height: 16px;
    background-image: url('https://raw.githubusercontent.com/Endor8/CSS/master/Icons/Bild3.png');
    background-size: 16px 16px !important;
    margin-left: 15px;
    margin-right: -31px;}
    
    
    #page-options > panel-list:nth-child(1) > panel-item:nth-child(5)::before {
    content: '';
    display: block;
    width: 16px;
    height: 16px;
    background-image: url('https://raw.githubusercontent.com/Endor8/CSS/master/Icons/Bild66.ico');
    background-size: 16px 16px !important;
    margin-left: 15px;
    margin-right: -31px;}
    
    
    #page-options > panel-list:nth-child(1) > panel-item:nth-child(7) {
    fill: transparent !important;}
    
    
    #page-options > panel-list:nth-child(1) > panel-item:nth-child(7)::before {
    content: '';
    display: block;
    width: 16px;
    height: 16px;
    background: url('https://raw.githubusercontent.com/Endor8/CSS/master//Icons/Bild62.png') no-repeat !important;
    background-size: 18px 18px !important;
    margin-left: 16px;
    margin-right: -32px;
    margin-bottom: 3px;}
    
    
    
    
    #page-options > panel-list:nth-child(1) > panel-item:nth-child(7):not([checked])::before {
    content: 'Nicht die';
    font-size: 14px;
    padding-left: 22px !important;
    padding-right: 35px !important;
    padding-top: 1px !important;
    padding-bottom: 2px !important;
    display: block;
    width: 16px;
    height: 16px;
    background: url('https://raw.githubusercontent.com/Endor8/CSS/master/Icons/Bild63.png') no-repeat !important;
    background-size: 18px 18px !important;
    margin-left: 18px;
    margin-right: -32px;}
    
    
    #page-options > panel-list:nth-child(1) > panel-item:nth-child(8)::before {
    content: '';
    display: block;
    width: 16px;
    height: 16px;
    background-image: url('https://raw.githubusercontent.com/Endor8/CSS/master/Icons/Bild64.png');
    background-size: 16px 16px !important;
    margin-left: 15px;
    margin-right: -31px;}
    
    
    #page-options > panel-list:nth-child(1) > panel-item:nth-child(10)::before {
    content: '';
    display: block;
    width: 16px;
    height: 16px;
    background-image: url('https://raw.githubusercontent.com/Endor8/CSS/master/Icons/Bild67.png');
    background-size: 16px 16px !important;
    margin-left: 15px;
    margin-right: -31px;}
    Alles anzeigen

    Sieht dann so aus:

    Nur zur Info, mit obigen CSS Code werden Symbole dem Kontextmenü hinzugefügt,

    selbige werden direkt von meiner Github Seite geladen.
    Wenn der Code passt, dann aber bitte eigene Symbole verwenden oder meine runter laden
    und lokal einbinden.

    Mfg.
    Endor

    Alles anzeigen

    Das hat mich außerdem auf die Idee gebracht, dass überall, wo in Menüs Einträge den Typ "checkbox" haben, ich die Symbole mit diesem Code anzeigen lassen kann. Ich habe nur das Symbol genommen, wenn nicht ausgewählt, so sehe ich, wenn es sich um diesen Typ handelt und nicht etwa ein Symbol fehlt.

    Und dein Code erspart in anderen Menüs die ganzen :hover-Einträge, echt super. :thumbup: Habe ich auch an anderen Stellen verwendet.

    CSS
    menuitem[checked="false"]::before {
    content: '';
    display: block;
    width: 16px;
    height: 16px;
    background: url('../../../../../icons/Bild63.png') no-repeat !important;
    margin: 0 -18px 0 2px;}
  • Symbole zu Kontextmenüs mit Javascript und CSS hinzufügen

    • bege
    • 12. Februar 2020 um 20:49
    Zitat von aborix

    Wahrscheinlich reicht in der letzten Zeile auch weniger als 1000 und dann können die anderen Werte vielleicht auch niedriger sein.

    Danke für den Tipp. Im Moment läuft's super. Freut mich richtig. :) Ich habe den FF mit Addons ziemlich vollgepackt, da braucht er 'ne Weile zum Starten und bis dahin sind auch die Skripte gelaufen. Also bis auf das Kontextmenü von TreeStyleTab alles perfekt. :thumbup:

  • Symbole zu Kontextmenüs mit Javascript und CSS hinzufügen

    • bege
    • 12. Februar 2020 um 17:00
    Zitat von aborix

    Ein anderer Code, damit bleibt die Web-Konsole auch mit TreeStyleTab unsichtbar:

    Super! Danke!

    Damit es hier funktioniert, musste ich

    - den Timeout-Wert von dem anderen Skript (Hinzufügen der CSS-class) höher setzten, damit dieses Skript vorher läuft.

    - den Timeout-Wert in Zeile 17 höher setzen, denn im Web-Entwickler-Menü blieb "Werkzeuge ein-/ausblenden" aktiviert, ohne dass die Werkzeuge angezeigt wurden. Wenn ich sie anzeigen lassen wollte, muss ich sie zweimal anklicken bzw. den Shortcut ausführen.

  • Tastaturkürzel für Add-ons deaktivieren?

    • bege
    • 11. Februar 2020 um 20:06

    Dankeschön für eure Antworten. Dann übe ich mich in Geduld.

  • Tastaturkürzel für Add-ons deaktivieren?

    • bege
    • 11. Februar 2020 um 17:34

    Hallo,

    (wie) ist es möglich, Tastaturkürzel für Add-ons nicht zu ändern, sondern zu deaktivieren? Viele der bei mir installierten Add-ons haben Tastaturkürzel, die ich nicht benötige und die sich mit anderen Kürzeln beißen. Ich habe nicht herausgefunden, wie ich die deaktivieren kann.

  • Symbole zu Kontextmenüs mit Javascript und CSS hinzufügen

    • bege
    • 11. Februar 2020 um 17:31
    Zitat von aborix

    Die Web-Konsole sollte sich mit ausreichend hohen Timeout-Werten unsichtbar öffnen. Mit TreeStyleTab ist sie bei mir aber dennoch oft zu sehen, was nicht sein dürfte. Wenn es egal ist, ob die Web-Konsole zu sehen ist oder nicht, lässt sich der Code vereinfachen. Die Zeilen 3 - 8 und 15 - 17 können dann weggelassen werden.

    Verstehe, danke. Habe ich mal auskommentiert, weil, wie du schon schreibst, die Konsole hier immer kurz angezeigt wird.

    Zitat von aborix

    Das wird schon. Man kommt auch mit kleinen Schritten weiter. :)

    Danke für die gute Zusprache ;)

    Zitat von aborix

    Für das Tab-Kontextmenü von TreeStyleTab habe ich noch nichts gefunden.

    Mit dem Warten und Hoffen habe ich bei dir ja nur gute Erfahrungen gemacht :D

  • Symbole zu Kontextmenüs mit Javascript und CSS hinzufügen

    • bege
    • 8. Februar 2020 um 16:59
    Zitat von aborix

    Deine Hoffnung scheint sich zu erfüllen. 8)

    ... und schneller als erhofft :)


    Zitat von aborix

    Folgender Test setzt voraus, dass die Web-Konsole unten oder seitlich angefügt und nicht in einem eigenen Fenster geöffnet wird; das ist ohnehin die Standardeinstellung.


    Lass den Code aus #21 weg und nimm folgenden hinzu:

    Das öffnet für einen Moment die Web-Konsole? Genial - wieder mal ^^

    Ja, mit höheren Timouts funktioniert es :thumbup:Vielen Dank!

    (Wenn ich den Code sehe, weiß ich, warum ich es wieder aufgegeben habe, Javascript zu lernen :|. Mehr als aus anderen Skripts was zusammenzubasteln kriege ich nicht hin.)

    Gibt es einen ähnlichen Trick auch für das Tab-Kontextmenü von TreeStyleTab?

  • Symbole zu Kontextmenüs mit Javascript und CSS hinzufügen

    • bege
    • 7. Februar 2020 um 01:44
    Zitat von aborix

    Ich kann das bestätigen. Ich habe keine Idee, warum das so ist und auch keine Lösung.

    aborix Danke für deine Unterstützung! Ich bin froh, dass es weitgehend funktioniert. Eine kleine Hoffnung habe ich noch: Schon manches Mal, wenn du in diesem Forum geschrieben hast, du wüsstest keine Lösung, hast du später doch noch eine gefunden 8)

    Hast du noch eine Idee, wie die CSS-Klassen auch zum Kontextmenü für die Tabs bei Verwendung von TreeStyleTab hinzugefügt werden können?

    Die Einträge stehen unter menupopup id=contentAreaContextMenu, das ist die gleiche ID wie beim normalen Seiten-Kontextmenü. In letzterem sind die Klassen hinzugefügt, bei ersterem fehlen sie.

  • Symbole zu Kontextmenüs mit Javascript und CSS hinzufügen

    • bege
    • 6. Februar 2020 um 19:20

    aborix

    Drei Beispiele aus dem gleichen Untermenü:

    Seitenquelltext anzeigen (funktioniert)

    CSS
    {-moz-image-region: rect(208px 112px 224px 96px) !important; list-style-image: url("mosaic.png") !important}

    Inspektor (funktioniert nicht)

    CSS
    {-moz-image-region: rect(80px 16px 96px 0) !important; list-style-image: url("mosaic.png") !important}

    Weitere Tools laden (funktioniert nicht)

    CSS
    {-moz-image-region: rect(432px 160px 448px 144px) !important; list-style-image: url("mosaic.png") !important}

    Während mehrerer Neustarts heute wurden die Symbole nach einem Neustart angezeigt, nach dem nächsten war es wieder vorbei mit der Herrlichkeit.

  • Symbole zu Kontextmenüs mit Javascript und CSS hinzufügen

    • bege
    • 5. Februar 2020 um 17:41
    Zitat von Boersenfeger
    Zitat von Endor

    Nur zur Info, mit obigen CSS Code werden Symbole dem Kontextmenü hinzugefügt,

    selbige werden direkt von meiner Github Seite geladen.
    Wenn der Code passt, dann aber bitte eigene Symbole verwenden oder meine runter laden
    und lokal einbinden.

    Mfg.
    Endor

    Ich würde diese gerne herunterladen, finde sie aber nicht... kannst du bitte mal einen Link senden oder posten?

    Vielen Dank! :)

    Wenn du den jeweiligen url-Link in der Adressleiste eingibst, bekommst du das Bild angezeigt und kannst es mit einem Rechtsklick speichern.

  • Symbole zu Kontextmenüs mit Javascript und CSS hinzufügen

    • bege
    • 5. Februar 2020 um 17:20
    Zitat von Endor

    Für das Kontextmenü der Entwickler Werkzeuge hätte ich was für dich:

    https://github.com/Endor8/CSS/blo…zeuge/Menus.css

    Symbole sind als Base64 Code integriert.

    Mfg.
    Endor

    Ich versuche es bisher mit dem Hinzufügen der class per JS, weil damit der CSS-Code wesentlich einfacher bleibt und keine extra :hover-Einträge nötig sind. Aber bisher klappt es nicht. Dein CSS-Code wäre die "Notlösung" für mich. Gut, eine zu haben. Vielen Dank dafür.


    Zitat von aborix

    Das Untermenü Web-Entwickler ist nach dem Start nur zu einem kleinen Teil vorhanden. Die restlichen Einträge kommern erst später dazu. Spätestens dann, wenn das Menü zum ersten Mal geöffnet wird, machmal auch früher, wenn ein Entwicklungswerkzeug benutzt wird, z.B. die Browserkonsole geöffnet wird. Mit folgendem Code werden die Klassennamen beim erstmaligen Öffnen des Menüs hinzugefügt:

    JavaScript
    let devPopup = document.getElementById('menuWebDeveloperPopup');
    devPopup.addEventListener('popupshown', () => {
      document.querySelectorAll('#menuWebDeveloperPopup menu')
        .forEach(query => query.classList.add('menu-iconic'));
      document.querySelectorAll('#menuWebDeveloperPopup menuitem')
        .forEach(query => query.classList.add('menuitem-iconic'));
    }, {once: true});

    Vielen Dank aborix . Die class wird jetzt hinzugefügt, aber die Symbole werden immer noch nicht angezeigt. Im Inspektor werden jetzt die richtige class und die Symbole angezeigt (sowohl bei Regeln als auch bei Berechnet), aber im Untermenü bleiben sie verschwunden. Ich kann keinen Unterschied erkennen zwischen diesen Einträgen und denen, für die die Symbole angezeigt werden. Was fehlt da noch oder ist im Weg?

  • Symbole zu Kontextmenüs mit Javascript und CSS hinzufügen

    • bege
    • 4. Februar 2020 um 19:15

    Jetzt bleibt nur noch die offensichtlich schwierige Frage, warum das Skript im Untermenü Web-Entwickler nur zwei der Einträge mit der class menuitem-iconic versorgt. In allen Firefox-Menüs klappt es, nur da nicht - und es ging schon mal, zunächst mit meiner umständlichen Version, dann kurze Zeit auch mit der von aborix . Jetzt gehen beide nicht mehr. :|

  • Symbole zu Kontextmenüs mit Javascript und CSS hinzufügen

    • bege
    • 4. Februar 2020 um 17:52
    Zitat von 2002Andreas

    Du suchst erst den Button raus...und öffnest dann die unteren Einträge mit dem kleinen Dreieck davor.

    Zitat von Endor

    Mit den Browser-Werkzeugen Pfeil auf Schaltfläche klicken

    und dann im Inspektor Suchen.

    Zitat von 2002Andreas

    Oder auch so über die Suche:

    Genial einfach - wenn man Helfer wie euch hat. Dankeschön :)

  • Symbole zu Kontextmenüs mit Javascript und CSS hinzufügen

    • bege
    • 4. Februar 2020 um 17:33
    Zitat von Endor

    bege

    Meinst das Kontextmenü von Sternschaltfläche in about:addons?

    Genau das meine ich, vielen Dank! Lokal einbinden mache ich.

    Wie hast du die Selektoren der Einträge herausgefunden, mit dem Inspektor geht es doch nicht, oder gibt es einen Trick?

  • Symbole zu Kontextmenüs mit Javascript und CSS hinzufügen

    • bege
    • 4. Februar 2020 um 16:37
    Zitat von milupo

    Du verwendest die falschen Entwickler-Werkzeuge. about:addons ist eine Seite, also gelten auch die Entwicklerwerkzeuge für Seiten und da gibt es den Eintrag gar nicht.

    Danke für den Tipp. Ich habe auch schon daran gedacht, mich aber davon in die Irre führen lassen, dass das Kontextmenü mit den Browserwerkzeugen untersucht werden kann, aber das gehört ja zur Benutzeroberfläche und nicht zum Seiteninhalt.

    Damit bleibt mein Problem aber bestehen, dass ich das Popup-Menü "Werkzeuge für alle Add-ons" nicht untersuchen kann, weil es nicht offen bleibt.

  • Symbole zu Kontextmenüs mit Javascript und CSS hinzufügen

    • bege
    • 3. Februar 2020 um 20:21

    Nach dem vielen Hin-und-Her in meinen obigen Posts hier die im Moment noch offenen Fragen:

    1. Obwohl "Popus nicht automatisch ausblenden" im Inspektor aktiviert ist, schließt sich das Werkzeuge-Menü auf about:addons wieder. Ist das bei euch auch so und gibt's dafür ein "Gegenmittel"?

    2. Das Skript fügt in praktisch allen Menüs die jeweilige class hinzu, bloß im Web-Entwickler-Untermenü nur bei den zwei letzten Einträgen, aber in allen anderen nicht. Bevor ich die verschiedenen Skriptversionen probiert habe, ging es. Woran kann das liegen?

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