Tao Audioplayer anpassen

Marco's Avatar

Marco

07 Oct, 2021 07:29 AM

This comment was split from the discussion: Verwendung: Tao Audioplayer anpassen

Hallo!
Ich möchte den Play Butten im Bild verkleinern, verfärben oder gleich weg lassen, da es Ihm eh in der Menüleiste gibt. Ich habe zwar für die css Background-colore, opacity und auch display none bereit doch finde ich die richtige Klasse nicht.
Zusätzlich möchte ich den Fortschrittsbalken (play-progress) die Farbe anpassen, auch hier finde ich die passende klasse nicht.
Könnt ihr mir weiterhelfen. Danke lg

  1. Support Staff 1 Posted by RockSolid Theme... on 07 Oct, 2021 07:40 AM

    RockSolid Themes's Avatar

    Vielen Dank für Ihre Frage.

    Ich möchte den Play Butten im Bild verkleinern

    Der Audio-Player besitzt nur einen Play-Button. Können Sie uns einen Screenshot senden der zeigt um welchen Button es sich handelt?

    Zusätzlich möchte ich den Fortschrittsbalken (play-progress) die Farbe anpassen, auch hier finde ich die passende klasse nicht.

    Die Farbe des Audio-Player-Fortschrittsbalkens lässt sich in den meisten Browsern nicht verändern.

  2. 2 Posted by Marco on 11 Oct, 2021 07:59 AM

    Marco's Avatar

    In der Mobilen Version, schiebt sich der Playbutton unter OS und Android mittig über das Standbild, wie in der Datei ersichtlich. Danke lg

  3. 3 Posted by Office Webnew on 11 Oct, 2021 08:03 AM

    Office Webnew's Avatar

    Sehr geehrtes Team!
    Im Anhang finden Sie den Screenshot wo sich der Play Button im
    Gesichtsfeld oder Mitten im Bild befindet
    Egal on OS oder Android versionen
    Danke
    MfG Glatz Marco

  4. Support Staff 4 Posted by RockSolid Theme... on 12 Oct, 2021 11:37 AM

    RockSolid Themes's Avatar

    Auf Ihren Screenshots ist kein Audio-Player zu sehen. Möchten Sie den Play-Button des Video-Element entfernen?

    Falls ja, lässt sich das im Chrome-Browser mit folgendem CSS-Code realisieren:

    video::-webkit-media-controls-overlay-play-button {
        display: none;
    }
    

    Für iOS gibt es derzeit keine Möglichkeit den zentrierten Play-Button zu verändern. Hierfür wäre die einzige Möglichkeit die controls komplett zu entfernen.

  5. 5 Posted by Office Webnew on 13 Oct, 2021 06:45 PM

    Office Webnew's Avatar

    Hallo!
    In den Bildern die Ich Ihnen zu gesendet habe, sieht man den overlay
    play button genau über dem Gesicht.
    Wenn ich Ihren Code einbringe, ist dieser zwar über dem Gesicht
    verschwunden, aber damit kann ich das Video auch nicht starten.
    Kann man den Button positionieren oder im Menueteil wo sich auch der
    Lautsprecher befindet integrieren?
    danke

  6. Support Staff 6 Posted by RockSolid Theme... on 14 Oct, 2021 08:03 AM

    RockSolid Themes's Avatar

    Sie können versuchen mit dem CSS-Selektor video::-webkit-media-controls-overlay-play-button den Play-Button zu verschieben. Allerdings ändern sich diese Elemente häufig bei größeren Browser-Updates und sind von Browser zu Browser sehr unterschiedlich.

    Wenn Sie mit dem Standard-Video-Player des Browsers nicht einverstanden sind, wäre vermutlich der bessere Weg einen Video-Player einzusetzen der auf JavaScript basiert wie z. B. videojs.com

Reply to this discussion

Internal reply

Formatting help / Preview (switch to plain text) No formatting (switch to Markdown)

Attaching KB article:

»

Attached Files

You can attach files up to 10MB

If you don't have an account yet, we need to confirm you're human and not a machine trying to post spam.

Keyboard shortcuts

Generic

? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac