1. Herzlich willkommen bei WPDE.org, dem grössten und ältesten deutschsprachigen Community-Forum rund um das Thema WordPress. Du musst angemeldet oder registriert sein, um Beiträge verfassen zu können.
    Information ausblenden

WP <5.0 Bildwechsel bei Mouseover

Dieses Thema im Forum "Design" wurde erstellt von sabbel2002, 24. Juni 2018.

  1. sabbel2002

    sabbel2002 Member

    Registriert seit:
    20. Januar 2018
    Beiträge:
    19
    Zustimmungen:
    0
    Hallo Leute,

    ich möchte eine Zeile mit 10 Bildern machen, bei dem jedes Bild beim berühren mit der Mouse von weiß ( wegen dem Design ) in das Original welchelt.

    Dazu habe ich das im Netz gedunden: Das Problem ist dass die Breite fest angegeben ist.
    Bei mobiler Ansicht sind die Bilder dann abgeschnitten.
    Hat jemand eine Idee wie man das anders umsetzen kann?
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Liebe Grüße Sabbel
     
  2. Sailor56

    Sailor56 Well-Known Member

    Registriert seit:
    13. Juni 2017
    Beiträge:
    794
    Zustimmungen:
    104
    Das sieht schon im Ansatz verkehrt aus!
    Du hast .bildwechsel mit einer festen Breite von 200px in ein .one_ten mit einer Breite von 10% hineingepackt.
    Du sagts .. 10 Bilder in einer Reihe(?).. das wären mindestens 2000px Platzbedarf. Sobald die Displaybreite kleiner als 2000px wird, kommt das zu Konflikten - das passt einfach nicht.
    Versuche mal deine Klasse .bildwechsel so zu formatieren.
    HTML:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
     
  3. sabbel2002

    sabbel2002 Member

    Registriert seit:
    20. Januar 2018
    Beiträge:
    19
    Zustimmungen:
    0
    Sobald ich 100% Breite angebe wird kein Bild angezeigt.
     
  4. Sailor56

    Sailor56 Well-Known Member

    Registriert seit:
    13. Juni 2017
    Beiträge:
    794
    Zustimmungen:
    104
    Dann einen Link zur Seite bitte - mit Glaskugel und Rätselraten kommen wir sonst nicht weiter!
     
  5. Sailor56

    Sailor56 Well-Known Member

    Registriert seit:
    13. Juni 2017
    Beiträge:
    794
    Zustimmungen:
    104
    Ich seh gerade... ich bin da etwas auf dem Holzweg! Es sind ja Hintergrundbilder...
    Also Kommando zurück... neuer Versuch.
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    mit der height- Angabe kannst du etwas spielen, um die Proportionen der Bilder passender einzustellen.
     
  6. sabbel2002

    sabbel2002 Member

    Registriert seit:
    20. Januar 2018
    Beiträge:
    19
    Zustimmungen:
    0
    Hallo .. vielen Dank.
    So sind die Bilder auch abgeschnitten.
    Ich kann die Bilder für die Hauptseite anpassen. Aber bei einer mobilen Ansicht passt es dann wieder nicht

    Hier der Link der Seite
    http://kaffee-doktor-bitburg.de/test/
     
  7. Sailor56

    Sailor56 Well-Known Member

    Registriert seit:
    13. Juni 2017
    Beiträge:
    794
    Zustimmungen:
    104
    Ergänze bitte folgendes in deinem CSS.
    HTML:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Und wenn dann immer noch die Bilder abgeschnitten werden, poste bitte einen Screenshot, damit wir sehen können, was du unter abgeschnitten verstehst.
    Bei mir sieht das jetzt bei eine Breite von 320px so aus:
    Bildschirmfoto vom 2018-06-25 um 05.50.04.png
     
  8. SEpp55

    SEpp55 Well-Known Member

    Registriert seit:
    3. Februar 2016
    Beiträge:
    3.138
    Zustimmungen:
    591
    Falls du das unten gezeigte Abschneiden meinst

    upload_2018-6-25_8-11-55.png

    füge in die style Anweisungen bei Bild1 und Bild2 (je2x) "background-repeat: no-repeat;" ein.
     
  9. sabbel2002

    sabbel2002 Member

    Registriert seit:
    20. Januar 2018
    Beiträge:
    19
    Zustimmungen:
    0
    Es funktioniert wunderbar.
    Danke für eure Unterstützung <3

    LG
    Sabbel
     
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Information ausblenden
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Information ausblenden