Ergebnis 1 bis 10 von 10

Thema: Bildwechsel bei Mouseover

  1. #1
    HTML Newbie
    Registriert seit
    25.01.2009
    Beiträge
    9
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard Bildwechsel bei Mouseover

    Ich suche ein Javascript um folgendes umzusetzen:
    siehe am Beispiel:
    http://www.reiterhof-toedt.de/beispiel/

    Beim Mouseover über Link1, ändert sich das Bild 0 in Bild A
    Bis hierhin ist es kein Problem!

    Jetzt soll aber zusätzlich, beim Überfahren von Link 2, sich das Bild 0 in Bild B wechseln! Da ich Bild 0 nur einen Namen vergeben kann (name="image1") weiss ich nicht wie ich dies umsetzen soll. Könnt ihr mir weiterhelfen?
    __________________________________________________ ________
    Hier der code:
    <html>
    <head>
    <script language="JavaScript">
    var NN3 = false;
    image1= new Image();
    image1.src = "0.jpg";
    image1on = new Image();
    image1on.src = "a.jpg";
    image2= new Image();
    image2.src = "0.jpg";
    image2on = new Image();
    image2on.src = "b.jpg";
    image3= new Image();
    image3.src = "0.jpg";
    image3on = new Image();
    image3on.src = "c.jpg";

    function on3(name) {
    document[name].src = eval(name + "on.src");
    }
    function off3(name) {
    document[name].src = eval(name + ".src");
    }
    NN3 = true;
    function on(name) {
    if (NN3) on3(name);
    }
    function off(name) {
    if (NN3) off3(name);
    }
    </script>
    </head>
    <body>
    <table border=0 align=left width="100%">
    <tr>
    <td valign=top>
    <p><img src="0.jpg" name="image1" height=150 width=150 border=0></p></td>
    <td valign=top>
    <p><a href="http://www.ebay.de" ONMOUSEOVER="on('image1');" ONMOUSEOUT="off('image1')">Link1</a></p>
    <p><a href="http://www.mobile.de">Link2</a></p>
    <p><a href="http://www.transfermarkt.de">Link3</a></p></td>
    </tr>
    </table>
    </body>
    </html>
    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
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard AW: Bildwechsel bei Mouseover

    vergib dem ding ne id, die dem namen gleich ist..
    mit document.getElementById(DIE_ID);
    kannste dir des objekt ranholen und document.getElementById(DIE_ID).src="bild.jpg"; ist dann die zuweisung eines neuen bildes in die entsprechende src.
    wenn du den bildern keine höhe und breite mitgibst wird sich das ding automatisch der echten grösse des bildes anpassen!
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  3. #3
    HTML Newbie
    Themenstarter

    Registriert seit
    25.01.2009
    Beiträge
    9
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Bildwechsel bei Mouseover

    Hi synaptic, mit deiner Aussage, kann ich nichts richtiges anfangen! Da fehlt mir wohl das wissen zu! Kannst du´s mir verständlicher erklären? Vielen Dank

  4. #4
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard AW: Bildwechsel bei Mouseover

    Code:
    function bildwechsel(obj, src){
    var bildobjekt = document.getElementById(obj);
    var bildquelle = src;
    bildobjekt.src = bildquelle;
    }
    HTML-Code:
    <img id="datbild" name="datbild" src="" />
    <br />
    <a href="#" onmouseover="bildwechsel('datbild', 'http://home.arcor.de/synaptic/eis.jpg');">dat is ein link mit mouseover</a>
    man vergibt eine ID, damit man via document.getElementByID() das objekt ranholen und in einer variablen speichern kann.
    dann kommt nen punkt und dahinter des zu ändernde attribut benennt nach dem '=' kommt dann der wert der zugewisen werden soll in gänsefüßli.
    Geändert von synaptic (04.02.2009 um 21:19 Uhr)
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  5. #5
    HTML Newbie
    Themenstarter

    Registriert seit
    25.01.2009
    Beiträge
    9
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Bildwechsel bei Mouseover

    Also das klappt bei mir nicht. Hab den ganzen Tag versucht den code und den htm text einzufügen. nichts geht!!!

  6. #6
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard AW: Bildwechsel bei Mouseover

    sind ja ach zwei kleine fehler drin.. das eis.png muss nen eis.jpg sein und beim onmousover fehlt nen "e"
    sollte onmouseover sein...
    mit etwas nachdenken und grundkenntnissen hätte des schon auffallen können..
    hab oben den text editiert und die fehler korrigiert...
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  7. #7
    HTML Newbie
    Themenstarter

    Registriert seit
    25.01.2009
    Beiträge
    9
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Bildwechsel bei Mouseover

    So sieht mein Code jetzt aus.
    Der Mouseover funzt, wechselt aber nicht wieder zurrück.
    Was mache ich falsch?

    <html>
    <head>
    <script language="JavaScript">
    function bildwechsel(obj, src){
    var bildobjekt = document.getElementById(obj).src="a.jpg";
    var bildquelle = src;
    bildobjekt.src = bildquelle;
    }
    </script>
    </head>
    <body>
    <table border=0 align=left width="100%">
    <tr>
    <td valign=top>
    <img id="datbild" name="datbild" src="0.jpg" />
    <br />
    </td>
    <td valign=top>
    <p><a href="#" onmouseover="bildwechsel('datbild', 'http://home.arcor.de/synaptic/eis.jpg');">dat is ein link mit mouseover</a></p>
    <p><a href="http://www.mobile.de">Link2</a></p>
    <p><a href="http://www.transfermarkt.de">Link3</a></p></td>
    </tr>
    </table>
    </body>
    </html>

  8. #8
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard AW: Bildwechsel bei Mouseover

    na wenn du nen effekt bei mouseover UND auch bei onmouseout haben willst, solltest du auch nen onmouseout einbauen... -.-
    also etwas mitdenken is im bereich webdevelopment schon gefragt!

    und benutz doch bitte die codetags im editor(#= code, < > = html, und das phpding is ja offensichtlich..), um deinen codefaxen hier übersdichtlicher zu gestalten
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  9. #9
    HTML Newbie
    Themenstarter

    Registriert seit
    25.01.2009
    Beiträge
    9
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Bildwechsel bei Mouseover

    Vielen vielen Dank synaptic. Du hast mir echt weitergeholfen. Vielleicht fange ich mit meinen 62 Jahren, nochmal an zu studieren. Ist ja alles so einfach.

  10. #10
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard AW: Bildwechsel bei Mouseover

    ob du es glaubst oder nicht, ich habe während meiner studienzeit zwei leutz im kurs gehabt, die mit 65 und 67 noch angefangen haben russisch zu studieren...
    und beide können es heute!

    und nur mal nebenbei bemerkt.. html ist kein hexenwerk, ebensowenig wie javascript...
    wenn man diese sachen benutzen möchte sollte man sich schon die grundlagen aneignen, sonst wird das nix.
    letztlich hat man nämlich keinen nutzen, wenn man sich jeden code zusammenschreiben lässt.. da kann man nämlich direkt hier im jobforum nen auftrag ausschreiben und ne gegenleistung vereinbaren!
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

Ähnliche Themen

  1. Bildwechsel
    Von kappilino im Forum HTML & CSS Forum
    Antworten: 6
    Letzter Beitrag: 12.09.2008, 23:23
  2. Doppelklick ("Mouseover") - Bildwechsel CSS
    Von Shyana im Forum HTML & CSS Forum
    Antworten: 3
    Letzter Beitrag: 28.04.2008, 15:01
  3. Bildwechsel
    Von funnie01 im Forum HTML & CSS Forum
    Antworten: 6
    Letzter Beitrag: 05.02.2008, 18:05
  4. Mouseover mit Sound und Bildwechsel
    Von Chico im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 4
    Letzter Beitrag: 21.08.2007, 23:23
  5. Tabellenzelle vergößert sich, bei mouseover bildwechsel ???
    Von wohlgemuth im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 05.02.2007, 09:11

Stichworte

Berechtigungen

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