Thomas: Grafikwechsel bei Mausüberfahrt

Hallo!

Ich bräuchte ein Script, das folgende Funktionen erfüllt.
Wenn man über einen bestimmten Teil des Bildes mit der Maus fährt, soll über einen Teil des Bildes ein anderes darübergelegt werden.

Kann mir jemand helfen?

Danke schon im Voraus!

MfG
Thomas

  1. Hallo!

    dito

    Ich bräuchte ein Script, das folgende Funktionen erfüllt.
    Wenn man über einen bestimmten Teil des Bildes mit der Maus fährt, soll über einen Teil des Bildes ein anderes darübergelegt werden.

    Kann mir jemand helfen?

    ja ich: http://selfhtml.teamone.de/javascript/beispiele/buttons.htm

    Danke schon im Voraus!

    gerne nachträglich ;)

    MfG
    Thomas

    Fabian

    1. n'abend,

      was ich nie so richtich verstanden hab, warum macht man das so kompliziert? wieso verwendet man nicht einfach

      onMouseOver="this.src='grafik2.jpg'"

      mfg,
      markus.

      1. Hallo.

        was ich nie so richtich verstanden hab, warum macht man das so kompliziert? wieso verwendet man nicht einfach

        onMouseOver="this.src='grafik2.jpg'"

        Wenn man das Image-Objekt verwendet, d.h.
         img = new Image();
         img.src = "weisichwas.gif";
        wird die Grafik vorgeladen, is ein bissel schöner, wenn das Austauschbild gleich zur Verfügung steht, und beim mouseover nicht erst geladen werden muss.
        Des Weiteren spart die Bildwechsel-Funktion des Beispiels (http://selfhtml.teamone.de/javascript/beispiele/buttons.htm) noch ein bissel Platz ein und macht die Seite somit kleiner.

        Gruß
        Norbert

        1. Hallo

          wie wärs mit dieser möglichkeit?

          ich habe folgendes java-Script:
          [CODE]
          function view_image(user,ValueShow) {
          var mousex = window.event.x;
          var mousey = window.event.y;
          user.style.visibility = ValueShow;
          [/CODE]

          Das script wird wie folgt im body aufgerufen bzw. der zweite absatz
          positioniert das bild an beliebiger stelle.
          [CODE]
          <img src="images/Bild_A_100.jpg" alt="klick größer!" border="0" style="cursor:hand" onmouseover="view_image(popupimage04,'visible')" onmouseout="view_image(popupimage04,'hidden')" width="100" height="80">
          .
          .
          <div id="popupimage04">
          <img src="images/Bild_A_450_S.jpg" width="420" height="340">
          </div>
          [/CODE]

          im HEAD bereich muss ausserdem diese eingetragen werden.
          [CODE]
          <style type="text/css">
          #popupimage01 { position: absolute; visibility: hidden }
          </style>
          [/CODE]

          Das ganze hat ebenfalls den nebeneffeckt das die Seite sich aufbaut un die zunächst unsichtbareb bilder vorgeladen werden.

          Gruß
          Caballonegro

      2. n'abend,

        was ich nie so richtich verstanden hab, warum macht man das so kompliziert? wieso verwendet man nicht einfach

        onMouseOver="this.src='grafik2.jpg'"

        mfg,
        markus.

        Hallo,

        naja. Bei einfachen Seiten wo ein einfacher Austausch eines oder weniger Bilder gewünscht wird mag das noch so gehen - aber so richtig sauber ist das nicht.

        Du musst wie von anderen schon bemerkt dann erstmal auf das Vorausladen der Grafik verzichten, was sich meistens als unschön erweist.

        Desweiteren musst Du den Code jedesmal neu eintippen - was nicht sehr effizient ist.

        Du hast mit Deiner Lösung nur einen einfachen Austausch. Das bisherige Bild wird durch ein anderes ersetzt - wenn Du nach dem "überfahren" mit der Maus wieder das ursprüngliche Bild einsetzen willst, must Du noch weitere Ereignisse behandeln.

        Wenn Du später beim Überfahren eines Bildes mit der Maus noch mehr machen möchtest, als einen Austausch zu machen, bekommst Du irgendwann hässlich lange Zeilen die keiner mehr lesen mag und die zudem recht unangenehm beim Debuggen oder Verändern sind.

        Aber: Generell kann man das natürlich so oder ähnlich machen.

        Grüße

        Axel

    2. Hallo noch mals!

      Danke für deine Hilfe, aber ich brauche ein Script, das nur, wenn man einen bestimmten Breich einer Grafik überfährt, eine andere Grafik einblendet (Landkarte, das immer den Teil, der mit der Maus überfahren wird, hervorhebt)

      MfG
      Thomas

      Hallo!
      dito
      Ich bräuchte ein Script, das folgende Funktionen erfüllt.
      Wenn man über einen bestimmten Teil des Bildes mit der Maus fährt, soll über einen Teil des Bildes ein anderes darübergelegt werden.

      Kann mir jemand helfen?
      ja ich: http://selfhtml.teamone.de/javascript/beispiele/buttons.htm
      Danke schon im Voraus!
      gerne nachträglich ;)
      MfG
      Thomas

      Fabian

      1. IMHO geht das wohl mit <area> und <shape> oder <map> oder so ähnlich, wo man kann über vektoren den bereich festlegen, der maus-sensitiv sein soll. das problem dabei ist nur, dass man wohl die komplette 'landkarte' neu laden muss, wenn man nur einen bereich einfärben will... schau mal im selfhtml unter <map>.

        schön abend noch,
        /markus.

        1. IMHO geht das wohl mit <area> und <shape> oder <map> oder so ähnlich, wo man kann über vektoren den bereich festlegen, der maus-sensitiv sein soll. das problem dabei ist nur, dass man wohl die komplette 'landkarte' neu laden muss, wenn man nur einen bereich einfärben will... schau mal im selfhtml unter <map>.

          schön abend noch,
          /markus.

          ---------------------

          nachtrag: hab ich grad weiter unten im forum gefunden, ist wahrscheinlich genau das, was du suchst...

          http://www.d-zahnmedizin.de/