Anzeige

Html mouse over ???

Html mouse over ??? | PSD-Tutorials.de

Erstellt von MrAlataril, 30.07.2013.

  1. MrAlataril

    MrAlataril Noch nicht viel geschrieben

    Dabei seit:
    30.07.2013
    Beiträge:
    3
    Html mouse over ???
    Wie funktioniert den dass alles, ich habe schon gesucht, aber nichts gefunden, was meinen code entspricht.

    Ich will das sich mein bild was ich habe zu einen anderen wird wenn man drüber fährt, (ich bin mit html noch nicht vertraut)

    Hier mal mein Code:
    HTML:
    1. <!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN">
    2.  
    3.  
    4.  <title>Sterner Stube</title>
    5.  
    6.   <BODY BGCOLOR="#000080">
    7.  
    8.  
    9.   </script>
    10.  
    11. </head>
    12.  
    13.  <body>
    14.  
    15.    <div:postion:relative><img style="display: block; text-align: center;" src="Seiten/Home/Oberei Bereich/Obere Bereich.gif" style=postion:absolute; top:0; left:0; z-index:1; width:1024px; height:515px;></div>
    16.    <li><img src="Seiten/Home/Oberei Bereich/Einzelne Bilder/Stern.gif" width="125" height="120" alt="" style="margin: -503px auto 0px 148px;" /></li>
    17.    <li><img src="Seiten/Home/Oberei Bereich/Einzelne Bilder/Stern.gif" width="125" height="120" alt="" style="margin: -522px auto 0px 1010px;" /></li>
    18.    <li><img src="Seiten/Home/Oberei Bereich/Einzelne Bilder/Schild Let's Plays.gif" width="125" height="130" alt="" style="margin: -550px auto 0px 340px;" /></li>
    19.    <li><img src="Seiten/Home/Oberei Bereich/Einzelne Bilder/Schild Reviews.gif" width="125" height="130" alt="" style="margin: -569px auto 0px 500px;" /></li>
    20.    <li><img src="Seiten/Home/Oberei Bereich/Einzelne Bilder/Schild Tutorials.gif" width="125" height="130" alt="" style="margin: -588px auto 0px 660x;" /></li>
    21.    <li><img src="Seiten/Home/Oberei Bereich/Einzelne Bilder/Schild Forum.gif" width="125" height="130" alt="" style="margin: -607px auto 0px 820px;" /></li>
    22.    <li><img src="Seiten/Home/Oberei Bereich/Einzelne Bilder/Sprecher.gif" width="200" height="100" alt="" style="margin: -430px auto 0px 490px;" /></li>
    23.    <li><img src="Seiten/Home/Oberei Bereich/Einzelne Bilder/Spiele.gif" width="200" height="100" alt="" style="margin: -449px auto 0px 710px;" /></li>
    24.    <li><img src="Seiten/Home/Oberei Bereich/Einzelne Bilder/Server.gif" width="200" height="100" alt="" style="margin: -468px auto 0px 930px;" /></li>
    25.  
    26.  
    27.    <li><img src="Seiten/Home/Unterei Bereich/Untere Bereich.gif" width="1024" height="1336" alt="" style="margin: -200px auto 0px 134px;" /></li>
    28.  
    29.  
    30.  </body>
    31.  
    32. </html>
    und ich will dass bei diesen bild, wo der code so aussieht::
    HTML:
    1. <li><img src="Seiten/Home/Oberei Bereich/Einzelne Bilder/Schild Let's Plays.gif" width="125" height="130" alt="" style="margin: -550px auto 0px 340px;" /></li>    
    dann beim drüber fahren, dass bild ändert.

    Aber ich habts dawei nicht zusammengebracht :':)':)'(
     
    #1      
  2. Curanai

    Curanai Aktives Mitglied

    Dabei seit:
    20.08.2011
    Beiträge:
    369
    Geschlecht:
    männlich
    Ort:
    Oldenburg
    Software:
    Notepad++
    Html mouse over ???
    AW: Html mouse over ???

    Du benötigst dafür kein HTML, sondern JavaScript (onmouseover()) oder - je nach Art der Änderung - einfach nur CSS :)hover).

    Wofür Du von mir eine glatte SECHS bekommst ist die Namensvergabe für Verzeichnisse und Dateien - aber die nimm Dir nicht so zu Herzen. ;)
     
    #2      
  3. MrAlataril

    MrAlataril Noch nicht viel geschrieben

    Dabei seit:
    30.07.2013
    Beiträge:
    3
    Html mouse over ???
    AW: Html mouse over ???

    java ok, da muss ich dann was im head schreiben wie heißt da der code, das java script aktiv ist.
    und in body was ist da der richtige code.
    hab mich dawei nur beschäftigt dass ich mal optisch was hab ;)
    Und wegn der namensgebung, das Oberei meinst du mit sechs oder ??? also das war absicht :D
     
    #3      
  4. leveler

    leveler 00110100 00110010

    Dabei seit:
    23.06.2008
    Beiträge:
    2.614
    Html mouse over ???
    AW: Html mouse over ???

    Nee Du, Java und JavaScript sind 2 paar Schuhe.

     
    #4      
  5. Curanai

    Curanai Aktives Mitglied

    Dabei seit:
    20.08.2011
    Beiträge:
    369
    Geschlecht:
    männlich
    Ort:
    Oldenburg
    Software:
    Notepad++
    Html mouse over ???
    AW: Html mouse over ???

    Nein, ich meine Apostroph im Namen, ich meine Leerschritte usw. - und wir reden über JavaScript; nicht Java!!
     
    #5      
  6. Trabilady

    Trabilady Aktives Mitglied

    Dabei seit:
    09.11.2012
    Beiträge:
    415
    Geschlecht:
    weiblich
    Ort:
    Bernau bei Berlin
    Software:
    Photoshop CS6
    Html mouse over ???
    AW: Html mouse over ???

    Schau mal hier - da kannst Du es "relativ" leicht mit CSS umsetzen.
     
    #6      
  7. MrAlataril

    MrAlataril Noch nicht viel geschrieben

    Dabei seit:
    30.07.2013
    Beiträge:
    3
    Html mouse over ???
    AW: Html mouse over ???

    Ok, ich meinte eh java script
    also ich habe jetzt im internet gesucht und bin auf das gestossen: http://www.on-mouseover.de/script1.htm

    ich habs mal nach dieser anleitung gemacht und bei der website zeigts das bild nicht an.

    Hier mein code in head:
    HTML:
    1.    language="JavaScript">
    2.     <!--
    3.    button1= new Image();
    4.    button1.src = "austausch1.src='Seiten/Home/Oberei Bereich/Einzelne Bilder/Schild Let's Plays.gif"
    5.    button2= new Image();
    6.    button2.src = "austausch1.src='Seiten/Home/Oberei Bereich/Einzelne Bilder/Schild Let's Plays nachher.gif"
    7.    /* usw. für alle Grafiken,
    8.    die am Mouse-Over-Effekt beteiligt sind */
    9.    //-->
    10.    </script>
    und im body:
    HTML:
    1. <a href="Let's Plays.html"
    2.  
    3.    onmouseover="austausch1.src='Seiten/Home/Oberei Bereich/Einzelne Bilder/Schild Let's Plays.gif';"
    4.    onmouseout="austausch1.src='Seiten/Home/Oberei Bereich/Einzelne Bilder/Schild Let's Plays nachher.gif';"
    5.  
    6.    <img src="Seiten/Home/Oberei Bereich/Einzelne Bilder/Schild Let's Plays.gif"
    7.    border="0" width="125" height="130" alt="" style="margin: -550px auto 0px 340px;"
    8.    name="austausch1">
    9.     </a>
    jetzt zeigts das bild nicht an habe ich aber jetzt den code so:
    HTML:
    1. <a> href="Let's Plays.html"
    2.  
    3.     onmouseover="austausch1.src='Seiten/Home/Oberei Bereich/Einzelne Bilder/Schild Let's Plays.gif';"
    4.     onmouseout="austausch1.src='Seiten/Home/Oberei Bereich/Einzelne Bilder/Schild Let's Plays nachher.gif';"
    5.  
    6.     <img src="Seiten/Home/Oberei Bereich/Einzelne Bilder/Schild Let's Plays.gif"
    7.    border="0" width="125" height="130" alt="" style="margin: -550px auto 0px 340px;"
    8.    name="austausch1">
    9.     </a>
    Zeigts das bild an aber ist keine bild veränderung dabei :':)'(
     
    #7      
  8. Mellymaus

    Mellymaus ~ Lady Pixel ~

    23
    Dabei seit:
    03.05.2011
    Beiträge:
    240
    Geschlecht:
    weiblich
    Ort:
    Berlin
    Software:
    Photoshop CS5
    Kameratyp:
    Canon EOS 450D
    Html mouse over ???
    AW: Html mouse over ???

    Du hast da leider einen kleinen Fehler eingebaut...

    es darf nicht "<a> href" lauten!

    Ändere Deinen Code wie folgt:

    <a href="Let's Plays.html"
    onmouseover="austausch1.src='Seiten/Home/Oberei Bereich/Einzelne Bilder/Schild Let's Plays.gif';"
    onmouseout="austausch1.src='Seiten/Home/Oberei Bereich/Einzelne Bilder/Schild Let's Plays nachher.gif';">
    <img src="Seiten/Home/Oberei Bereich/Einzelne Bilder/Schild Let's Plays.gif"
    border="0" width="125" height="130" alt="" style="margin: -550px auto 0px 340px;" name="austausch1">
    </a>

    Habe es mal mit einer Alternativgrafik getestet. Es ging! :)
     
    Zuletzt bearbeitet: 30.07.2013
    #8      
x
×
×