ilch Forum » Ilch CMS 2.X » Fehlersuche und Probleme » Mouseover fehler anzeige

Geschlossen
  1. #1
    User Pic
    M.vittel Mitglied
    Registriert seit
    16.11.2018
    Beiträge
    328
    Beitragswertungen
    24 Beitragspunkte
    Benötige mal wieder Hilfe...
    Ich habe hier versucht ein Mouseover zu bauen welches ein Bild anzeigen soll, das Klappt ja soweit.
    Leider verschiebt sich aber der Text wie man sieht auf folgenden Link:
    gdz.bplaced.net/index.php/test-siedlung.html

    Test Zeile:
    1. Baue 6 Bhavans
    Belohnung: Vorräte

    wie bekomme ich es hin das nur die 2 Zeilen angezeigt werden? (1. Baue 6 Bhavans <in einer Zeile)
    Wie bekommt man es hin, dass der zweite Text "Belohnung: Vorräte" unter den ersten steht?

    Code:
    <p><strong>1.</strong>&nbsp;Baue 6 <a class="popup" href="#">Bhavans<span><img src="https://www.gdz.bplaced.net/Bilder/Siedlungen/110/M-Bhavan.png" /></span></a><br />
    <strong>Belohnung:</strong>&nbsp;<strong><img src="https://www.gdz.bplaced.net/Bilder/Werkzeug.png" title="xxxxx" />&nbsp;</strong>Vorr&auml;te<br />


    a.popup {
      text-decoration:none;
      position:relative;
      display:block;
    }
    a.popup:hover {
      border:none;
    }
    a.popup img {
      border:none;
    }
    a.popup span {
      visibility:hidden;
      position:absolute;
      top:-80px;
      left:200px;
    }
    a.popup:hover span {
      visibility:visible;
    }


    Danke im voraus für die Hilfe glücklich


    verwendete ilch Version: 2.1.x


    Zuletzt modifiziert von M.vittel am 25.12.2021 - 18:04:28
    RealLife ... das ist doch das Game mit der geilen Grafik und der scheiss Story
    0 Mitglieder finden den Beitrag gut.
  2. #2
    User Pic
    BlackRomeo Moderator
    Registriert seit
    31.01.2014
    Beiträge
    274
    Beitragswertungen
    27 Beitragspunkte
    Hallo Vittel,

    Das ist ein CSS Problem ich habe es mal Getestet und so hin bekommen.

    a.popup {
      text-decoration:none;
      position: relative;
      display: -moz-grid;
    }
    a.popup:hover {
      border:none;
    }
    a.popup img {
      border:none;
    }
    a.popup span {
      visibility:hidden;
      position:absolute;
      top:-80px;
      left:200px;
    }
    a.popup:hover span {
      visibility:visible;
    }


    Teste es mal ob es so Funktioniert bei dir und gebe mir mal eben Rückmeldung wäre sehr lieb ^^

    Lg


    Zuletzt modifiziert von BlackRomeo am 24.12.2021 - 21:52:00
    | SchlueppaTv Twitch Streamer |
    | www.twitch.tv/schlueppatv |

    0 Mitglieder finden den Beitrag gut.
  3. #3
    User Pic
    M.vittel Mitglied
    Registriert seit
    16.11.2018
    Beiträge
    328
    Beitragswertungen
    24 Beitragspunkte
    Es ist jetzt auf jeden fall so das es in eine Zeile ist aber das Popup Fenster (Bild) öffnet sich nicht mehr.
    RealLife ... das ist doch das Game mit der geilen Grafik und der scheiss Story
    0 Mitglieder finden den Beitrag gut.
  4. #4
    User Pic
    BlackRomeo Moderator
    Registriert seit
    31.01.2014
    Beiträge
    274
    Beitragswertungen
    27 Beitragspunkte
    Ok das ist Komisch den bei mir Öffnet es sich ^^

    ich schaue nachher mal weiter und gebe dir dann bescheid Liegt aber auf jeden fall am CSS



    Edit:

    Hey ich weiß nicht ob es jetzt so bei dir Funktioniert falls nicht weiß ich leider auch nicht weiter.


    <div class="hover">
      <p><strong>1.</strong>&nbsp;Baue 6 <a class="popup" href="#">Bhavans<span><img src="https://www.gdz.bplaced.net/Bilder/Siedlungen/110/Bhavan110.png" /></span></a>
        <br/>
        <strong>Belohnung:</strong>&nbsp;<strong><img src="https://www.gdz.bplaced.net/Bilder/Werkzeug.png" title="xxxxx" />&nbsp;</strong>Vorr&auml;te
      </div>





    div.hover {
      text-decoration: none;
      position: relative;
      display: -moz-grid;
    }
    
    a.popup:hover {
      border:none;
    }
    
    a.popup img {
      border:none;
    }
    
    a.popup span {
      visibility:hidden;
      position:absolute;
      top:-80px;
      left:200px;
    }
    a.popup:hover span {
      visibility:visible;
    }



    Zuletzt modifiziert von BlackRomeo am 25.12.2021 - 01:56:40
    | SchlueppaTv Twitch Streamer |
    | www.twitch.tv/schlueppatv |

    0 Mitglieder finden den Beitrag gut.
  5. #5
    User Pic
    M.vittel Mitglied
    Registriert seit
    16.11.2018
    Beiträge
    328
    Beitragswertungen
    24 Beitragspunkte
    Ein Fettes Danke Schön, da musste wohl ein Profi dran :-)
    Hat geklappt, freue mich sehr darüber.
    RealLife ... das ist doch das Game mit der geilen Grafik und der scheiss Story
    0 Mitglieder finden den Beitrag gut.
  6. #6
    User Pic
    BlackRomeo Moderator
    Registriert seit
    31.01.2014
    Beiträge
    274
    Beitragswertungen
    27 Beitragspunkte
    Nun Profi bin ich nicht ^^ bin selbst noch am lernen.
    | SchlueppaTv Twitch Streamer |
    | www.twitch.tv/schlueppatv |

    2 Mitglieder finden den Beitrag gut.
  7. #7
    User Pic
    M.vittel Mitglied
    Registriert seit
    16.11.2018
    Beiträge
    328
    Beitragswertungen
    24 Beitragspunkte
    So sieht es nun aus:
    externer Link

    Das einzige was nicht funktioniert ist, die Anzeige für Mobile. Dort müsste man ja auf das Wort (Link) gedrückt bleiben, wird nur ein x angezeigt. Leider weis ich nicht ob das überhaupt möglich ist, weis das einer von euch?


    Zuletzt modifiziert von M.vittel am 27.12.2021 - 09:19:15
    RealLife ... das ist doch das Game mit der geilen Grafik und der scheiss Story
    0 Mitglieder finden den Beitrag gut.
  8. #8
    User Pic
    BlackRomeo Moderator
    Registriert seit
    31.01.2014
    Beiträge
    274
    Beitragswertungen
    27 Beitragspunkte
    soweit ich weiß ist das für Mobile nicht aber was du machen kannst ist für Mobile etwas code dazu das es dan Angezeigt wird als Bild ohne drauf zu müssen
    | SchlueppaTv Twitch Streamer |
    | www.twitch.tv/schlueppatv |

    0 Mitglieder finden den Beitrag gut.
  9. #9
    User Pic
    M.vittel Mitglied
    Registriert seit
    16.11.2018
    Beiträge
    328
    Beitragswertungen
    24 Beitragspunkte
    Danke der Antwort, genau das ist es was ich dann am Endeffekt nicht möchte, denn dann hat man das Bild immer sichtbar und es würde entweder Text Überdecken oder von den Texten oder auch die Seitengröße verschieben/verlängern.
    RealLife ... das ist doch das Game mit der geilen Grafik und der scheiss Story
    1 Mitglieder finden den Beitrag gut.
Geschlossen

Zurück zu Fehlersuche und Probleme

Optionen: Bei einer Antwort zu diesem Thema eine eMail erhalten