1. Diese Seite verwendet Cookies. Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies. Weitere Informationen

Mouseover - Bild ändert sich

Dieses Thema im Forum "Web-Programmierung" wurde erstellt von Murcielago, 04.02.09.

  1. Murcielago

    Murcielago Westfälischer Gülderling

    Dabei seit:
    04.01.07
    Beiträge:
    4.586
    Moin Leutz,

    ich möchte eine solche Animation basteln:
    http://photozone.de/canon-eos/412-tamron_18270_3563vc_canon
    (runterscrollen bis zum Vergleich 18-270 vs- 18-200 IS).

    Der Code sieht bei Photozone so aus:

    Code:
    <table>
      <caption>Move your mouse pointer in/out of the image to "zoom out".</caption>
         <tbody>
            <tr align="center">
              <td><a href="javascript:void(0)" onmouseover="hiLite('mode','A2'); return true" onmouseout="hiLite('mode','A1'); return true"><img src="/images/8Reviews/lenses/tamron_18270_3563vc_canon/tam_vs_can1.jpg" name="mode" border="1"></a><br />
            </td>
            </tr>
         </tbody>
    </table>
    

    Wie krieg ich das selber hin?
    Die Fotos sollen meinetwegen ein.jpg und aus.jpg heißen.



    Danke für eure Hilfe.
     
  2. torben1

    torben1 Süsser Pfaffenapfel

    Dabei seit:
    05.08.08
    Beiträge:
    661
  3. Murcielago

    Murcielago Westfälischer Gülderling

    Dabei seit:
    04.01.07
    Beiträge:
    4.586
    Hilfe ... gehts nicht einfacher, am besten als vorgefertigter Code, wo ich nur die Dateinamen ändern muss? :eek:
     
  4. hacmac

    hacmac Bismarckapfel

    Dabei seit:
    15.10.08
    Beiträge:
    141
    is doch eh einfacher, da brauchst doch nur mehr austauschen!
     
  5. torben1

    torben1 Süsser Pfaffenapfel

    Dabei seit:
    05.08.08
    Beiträge:
    661
    Nagut will nicht so sein ;)

    Code:
    <script type="text/javascript">
        bild1on = new Image();
        bild1on.src = "ein.jpg";
        bild1off = new Image();
        bild1off.src = "aus.jpg";
    
    function an(ImageName) {
        if(document.images) {
            document[ImageName].src = eval(ImageName + "on.src");
        }
        
    }
        
    function aus(ImageName)    {
        if(document.images) {
            document[ImageName].src = eval(ImageName + "off.src");
        }
        
    }
    </script>
    
    Code:
    <img src="aus.jpg" border="0" name="bild1" onmouseover="an('bild1'); " onmouseout="aus('bild1');">
    
    So sollte es funktionieren. Du kannst das ganze jetzt auch einfach erweitern.

    Torben
     
  6. Murcielago

    Murcielago Westfälischer Gülderling

    Dabei seit:
    04.01.07
    Beiträge:
    4.586
    Wofür der zweite Code?
    Hintereinander einbauen?
     
  7. torben1

    torben1 Süsser Pfaffenapfel

    Dabei seit:
    05.08.08
    Beiträge:
    661
    Das erste ist Javascript und verantwortlich für den Wechsel. Der zweite Code ist das Bild mit dem Aufruf der Wechselfunktion. Kannst Du hintereinander einbauen. Das Script sollte aber eigentlich in den Header.

    Torben
     
  8. Murcielago

    Murcielago Westfälischer Gülderling

    Dabei seit:
    04.01.07
    Beiträge:
    4.586
    wenn ich den Seitencode jetzt ganz gelöscht habe .... und nur die beiden Codes einbau, gehts dann nicht?
     
  9. torben1

    torben1 Süsser Pfaffenapfel

    Dabei seit:
    05.08.08
    Beiträge:
    661
    Ähmm nein. Du musst das ganze schon in deine Seite einbauen. Die Bilder müssen da sein und auch so heißen.
    Am besten ist es wohl Du postest Deine Seite oder gibst mir per pm den Link und ich baue es Dir eben ein.

    Torben
     
    Murcielago gefällt das.

Diese Seite empfehlen