tutorials.de Buch-Aktion 05/2012
ERLEDIGT
JA
ANTWORTEN
5
ZUGRIFFE
16200
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
AUF DIESES THEMA
ANTWORTEN
  1. 18.05.06 15:45 #1
    Avatar von Suchfunktion
    Suchfunktion Suchfunktion ist offline Mitglied Brillant
    Registriert seit
    Apr 2003
    Ort
    Hannover (Niedersachsen)
    Beiträge
    777
    Hi!

    Ich habe folgenden (Beispiel-)HTML-Code:
    HTML-Code:
    ...
<body>
  <div class="menu">
    <div class="entry1">
      <img src="foo.jpg" id="image1"> foo1
    </div>
    <div class="entry2">
      <img src="foo.jpg" id="image2"> foo2
    </div>
    <div class="entry3">
      <img src="foo.jpg" id="image3"> foo3
    </div>
  </div>
</body>
...
    Wie kann ich es bewerkstelligen,
    dass die Bilder (foo.jpg) ausgeblendet sind und wenn ich ueber einen der <div class="entry"> Bereiche gehe, das jeweils enthaltene Bild eingeblendet wird? (Nur in dem entsprechenden DIV-Bereich, nicht alle Bilder!)
    Es soll halt immer das Bild angezeigt werden, ueber dessen DIV-Bereich ich mich befinde.

    Ich moechte mich schonmal im Voraus bedanken!

    See ya.
     
    Zitieren Zitieren
  2. 18.05.06 15:54 #2
    Avatar von forsterm
    forsterm forsterm ist offline Mitglied Rubin
    Registriert seit
    Nov 2004
    Ort
    Bayern
    Beiträge
    1.328
    Hallo,
    so
    HTML-Code:
    <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<script type="text/javascript">
<!--
function show_pic(picID){
  var myObj = document.getElementById(picID);
  if(myObj.style.display == "none"){
    myObj.style.display = "block";
  }else{
    myObj.style.display = "none";
  }
}
//-->
</script>
</head>
<body>
  <div class="menu">
    <div class="entry1" onmouseover="show_pic('bild1')" onmouseout="show_pic('bild1')">
      <img id="bild1" style="display: none" src="foo.jpg"> foo1
    </div>
    <div class="entry2" onmouseover="show_pic('bild2')" onmouseout="show_pic('bild2')">
      <img id="bild2" style="display: none" src="foo.jpg"> foo2
    </div>
    <div class="entry3" onmouseover="show_pic('bild3')" onmouseout="show_pic('bild3')">
      <img id="bild3" style="display: none" src="foo.jpg"> foo3
    </div>
  </div>
</body>
</html>
    sollte es funktionieren.

    mfg
    forsterm
     
    Wie man Fragen richtig stellt

    Wichtig:     Bitte markiert eure beantworteten Fragen als "erledigt" (links unten auf "Erledigt" klicken).
    __________________
    .:Mitglied #26 des 1. offiziellen Sven Uwe Fan-Clubs:.
    Zitieren Zitieren
  3. 19.05.06 08:11 #3
    Avatar von Suchfunktion
    Suchfunktion Suchfunktion ist offline Mitglied Brillant
    Registriert seit
    Apr 2003
    Ort
    Hannover (Niedersachsen)
    Beiträge
    777
    Hi, danke.
    Eigtl. haette ein Loesungs-Ansatz voll ausgereicht, aber das ist ja echt sehr geil!

    Vielen, vielen Dank!!
     
    Zitieren Zitieren
  4. 19.05.06 08:48 #4
    Avatar von Suchfunktion
    Suchfunktion Suchfunktion ist offline Mitglied Brillant
    Registriert seit
    Apr 2003
    Ort
    Hannover (Niedersachsen)
    Beiträge
    777
    Hi.
    An sich funktioniert es schonmal so halbwegs :P

    Aber die Sache ist die, dass wenn ich ueber einen der DIV-Bereiche gehe, die Grafik komplett 'entfernt' wird, somit rutscht der Text nach links.
    Das hatte ich nicht bedacht

    Vermutlich muss ich die Grafiken austauschen lassen.
    (Onmouseover -> Normales bild anzeigen. Onmouseout -> leeres Platzhalterbild anzeigen.)
    Wie mache ich das?

    Danke
     
    Zitieren Zitieren
  5. 19.05.06 11:06 #5
    Avatar von Sven Mintel
    Sven Mintel Sven Mintel ist offline Mitglied
    Registriert seit
    Aug 2003
    Beiträge
    18.238
    Blog-Einträge
    6
    Ändere anstelle der display-Eigenschaft die visibility-Eigenschaft auf "hidden" bzw. "visible" ....dann verrutscht nichts.
     
    Zitieren Zitieren
  6. 19.05.06 11:12 #6
    Avatar von Suchfunktion
    Suchfunktion Suchfunktion ist offline Mitglied Brillant
    Registriert seit
    Apr 2003
    Ort
    Hannover (Niedersachsen)
    Beiträge
    777
    Hi!

    Habe eben das ganze mal mit CSS umgesetzt.
    (Mit Hovereffekt. also .entry:hover{ background..blabla })
    Klappt auch (teilweise) ganz gut.

    Von daher -> Thema erledigt

    Trotzdem nochmal vielen Dank!

    mfg
    Suche
     
    Zitieren Zitieren
« Wert aus Pop-up-Fenster an Eltern-Dokument übergeben | Parameter wird gelöscht bei rekursiver Funktion »

Ähnliche Themen

  1. Sony Vegas Animation: Bild in Bild einblenden
    Von Pris0n im Forum Videoschnitt, Videotechnik & -produktion
    Antworten: 3
    Letzter Beitrag: 17.01.08, 11:47
  2. Bild/Div bei MouseOver einblenden
    Von schutzgeist im Forum CSS
    Antworten: 16
    Letzter Beitrag: 25.06.07, 20:16
  3. [C#] Bild Effekt Einblenden
    Von korsosjosi im Forum .NET Grafik und Sound
    Antworten: 1
    Letzter Beitrag: 15.05.07, 21:33
  4. onmouseover bild
    Von Headymaster im Forum Javascript & Ajax
    Antworten: 1
    Letzter Beitrag: 10.02.07, 20:13
  5. Probleme mit OnMouseOut / OnMouseOver beim einblenden von Texten
    Von digiTAL im Forum HTML & XHTML
    Antworten: 4
    Letzter Beitrag: 06.05.05, 12:54