Ergebnis 1 bis 5 von 5

Thema: Bildpopup per OnMouseOver auf Text / Textlink

  1. #1
    Youngster
    Registriert seit
    02.09.2006
    Beiträge
    10
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard Bildpopup per OnMouseOver auf Text / Textlink

    Hallo, ich denke es gibt hier schon einen Beitrag wo es beschrieben ist, aber trotz langer Suche hab ich leider nix hilfreiches finden können.
    Also mein Problem ist folgendes, ich möchte auf meiner Seite Bilder zu Produkten als Popup öffnen lassen wenn man mit dem Mauszeiger auf den dazugehörigen Link fährt. und bei verlassen das Links soll das Fenster wieder schliessen. das Fenster soll an der Stelle des Mauszeigers öffnen und die Größe der Bilddatei haben. Bitte helft mir mit einem Quelltext, Danke.
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Kaiser(in)
    Registriert seit
    24.04.2006
    Ort
    Ludwigshafen
    Beiträge
    2.720
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Schreib mal das vor </head>:
    Code:
    <style type="text/css">
    
    a.bild1&#123;
        position&#58;relative;
        z-index&#58;1; background-color&#58;#ccc;
        color&#58;#000;
        text-decoration&#58;none&#125;
    
    a.bild1&#58;hover&#123;z-index&#58;2; background-color&#58;#ff0&#125;
    
    a.bild1 span&#123;display&#58; none;
    background-image&#58; url&#40;bild1.jpg&#41;;
    &#125;
    
    a.bild1&#58;hover span&#123;
        display&#58;block;
        position&#58;absolute;
        top&#58;2em; left&#58;2em; width&#58;150px;height&#58;200px;
        border&#58;1px solid #0cf;
     color&#58;#000;
        text-align&#58; center&#125;
    </style>
    und das innerhalb des Body-Bereichs an die entsprechende Text-Stelle:

    Code:
    Normaler Text Hover Text mit Bildeinblendung<span></span> normaler Text
    Das Ganze müsstest du jetzt für alle weiteren Bilder entsprechend wiederholen, was bei vielen bildern sicherlich sehr unübersichtlich wird. Eine einfachere Lösung hab ich aber nicht parat.

  3. #3
    Youngster
    Themenstarter

    Registriert seit
    02.09.2006
    Beiträge
    10
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Das ist leider nicht ganz das was ich mir vorgestellt hab, denn es sind dann doch ein paar mehr Bilder die angezeigt werden sollen. Kann man event. nen Quellcode von ner OnMouseOver Bildvergrößerung umschreiben oder so damit halt die Artikelbezeichnung beim Drüberfahren mit der Maus nen Bild dazu bekommen?

  4. #4
    Azubi(ne)
    Registriert seit
    08.01.2007
    Beiträge
    64
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Hallo,

    koenntest du mir vielleicht die funktion von dem <span>-tag hier erklaeren? (also das was du mit dem zugehoerigen CSS-Code ereichen willst)

    MfG,
    HolyMarcell
    www.holy-infos.de

  5. #5
    Kaiser(in)
    Registriert seit
    24.04.2006
    Ort
    Ludwigshafen
    Beiträge
    2.720
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Mit der Theorie hab ich's nicht so, den Code hab ich mal irgendwo gefunden.
    Beim ersten span "a.bild1 span" wird das Bild hinterlegt, ohne dass es zunächst erscheinen soll.
    Der zweite span bewirkt, dass beim Hovern das Bild über die Klasse "a.bild1:hover span" mit Größenangaben und Positionierung erscheint.
    Innerhalb des HTML-Span-Tags könntest du auch noch einen Text schreiben (das Bild dann evtl. weglassen), so dass beim Hovern eine Infoerklärung eingeblendet wird.

Ähnliche Themen

  1. Antworten: 4
    Letzter Beitrag: 09.06.2008, 19:37
  2. textlink tausch für musikseite und erotikshop
    Von im Forum Promotion - SEO - Suchmaschine (Google & Co) – Mitarbeiter & Linkpartnersuche
    Antworten: 1
    Letzter Beitrag: 03.12.2006, 11:27
  3. onMouseOver auf Text anwenden
    Von Mannix-KR im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 1
    Letzter Beitrag: 02.10.2006, 13:17
  4. per onmouseover in anderer tabelle text variabel an zeigen
    Von Korty im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 3
    Letzter Beitrag: 27.09.2006, 01:38
  5. Biete Textlink auf meiner Pagerank 5 Startseite
    Von Randy0902 im Forum Promotion - SEO - Suchmaschine (Google & Co) – Mitarbeiter & Linkpartnersuche
    Antworten: 1
    Letzter Beitrag: 10.07.2005, 23:41

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •