onMouseOver, kellään auttavaa kättä?

breaky

Minulla on mapatut linkit / imagemap.
Olisi tarkoituksena saada toimiva "onMouseOver" -efekti jokaisen linkin kohdalle, eli siis linkin kuva vaihtuu. Esimerkkinä kuvalinkki
"Moi" josta saisi vain siirtämällä hiirtä päälle "ioM" tekstiksi -> KUVAKSI.

Eli onMouseOver 'ia kaipailisin tai jotain apua. :)

Sen voisitte vaikka lisätä tähän koodiin:

8

2199

    Vastaukset

    Anonyymi (Kirjaudu / Rekisteröidy)
    5000
    • Ruussi

      jokaista linkkiä varten erilaisen kuvan koko kuvakartasta.





      Funktiossa määritetään kuvakartan kuvan tilalle toinen kuva.

      • breaky

        Kiitos todella paljon! Tuo olikin minulle aivan uutta, en ole ajatellutkaan sen menevän noin... :)

        onmouseover="highlight(0);" onmouseout="highlight(0);">

        Tuleeko tämän muuttuvan kuvan NIMI kohtaan "highlight(0);" ?

        Jos kuvakartta on "apua.jpg" ja muuttuva kuva "apua2.jpg",
        niin eihän niitä näin laiteta:
        onmouseover="apua.jpg;" onmouseout="apua2.jpg;">

        vaan..?


      • Jererererere
        breaky kirjoitti:

        Kiitos todella paljon! Tuo olikin minulle aivan uutta, en ole ajatellutkaan sen menevän noin... :)

        onmouseover="highlight(0);" onmouseout="highlight(0);">

        Tuleeko tämän muuttuvan kuvan NIMI kohtaan "highlight(0);" ?

        Jos kuvakartta on "apua.jpg" ja muuttuva kuva "apua2.jpg",
        niin eihän niitä näin laiteta:
        onmouseover="apua.jpg;" onmouseout="apua2.jpg;">

        vaan..?

        http://www.frankmanno.com/ideas/css-imagemap/


      • Ruussi
        breaky kirjoitti:

        Kiitos todella paljon! Tuo olikin minulle aivan uutta, en ole ajatellutkaan sen menevän noin... :)

        onmouseover="highlight(0);" onmouseout="highlight(0);">

        Tuleeko tämän muuttuvan kuvan NIMI kohtaan "highlight(0);" ?

        Jos kuvakartta on "apua.jpg" ja muuttuva kuva "apua2.jpg",
        niin eihän niitä näin laiteta:
        onmouseover="apua.jpg;" onmouseout="apua2.jpg;">

        vaan..?

        näin:

        HEAD-osioon:

        function highlight( pic )
        {
        document.images[help].src = kuva pic ".jpg";
        }

        Muokatut kuvat ovat siis nimeltään kuva1, kuva2, kuva3, kuva4 jne..

        Ladattava kuva määritellään siis jokaisessa linkissä, kun kutsutaan highlight-funktiota (onmouseover tapahtumassa) (suluissa oleva luku). Näin ollen 0-tarkoittaa peruskarttaa ja numerot 1-n muokattuja kuvakarttoja.

        Koodissa näytti olevan virhe, tässä korjattu:

        Ensimmäinen linkki:


      • breaky
        Ruussi kirjoitti:

        näin:

        HEAD-osioon:

        function highlight( pic )
        {
        document.images[help].src = kuva pic ".jpg";
        }

        Muokatut kuvat ovat siis nimeltään kuva1, kuva2, kuva3, kuva4 jne..

        Ladattava kuva määritellään siis jokaisessa linkissä, kun kutsutaan highlight-funktiota (onmouseover tapahtumassa) (suluissa oleva luku). Näin ollen 0-tarkoittaa peruskarttaa ja numerot 1-n muokattuja kuvakarttoja.

        Koodissa näytti olevan virhe, tässä korjattu:

        Ensimmäinen linkki:

        Jos kuva suuri ja haluaa tuol taval tehdä niin kannattaa miettiä joskos olis mahdollista kuva pilkkoa pieniksi palasiksi tällöin ei tarvitsisi suurta kuvaa siirtää vaan pien palanen.


      • Ruussi
        breaky kirjoitti:

        Jos kuva suuri ja haluaa tuol taval tehdä niin kannattaa miettiä joskos olis mahdollista kuva pilkkoa pieniksi palasiksi tällöin ei tarvitsisi suurta kuvaa siirtää vaan pien palanen.

        silloin voi tehdä niin kuin jere kertoo viestissään.


      • Jererererere
        Ruussi kirjoitti:

        silloin voi tehdä niin kuin jere kertoo viestissään.

        Heh piti kopioida ja liittää oma nimimerkki eikä suinkaan breakyn ;)


    • tuolla

    Ketjusta on poistettu 2 sääntöjenvastaista viestiä.

    Luetuimmat keskustelut

    1. Aivosyöpää sairastava Olga Temonen TV:ssä - Viimeinen Perjantai-keskusteluohjelma ulos

      Näyttelijä-yrittäjä Olga Temonen sairastaa neljännen asteen glioomaa eli aivosyöpää, jota ei ole mahdollista leikata. Hä
      Maailman menoa
      91
      2900
    2. Pelotelkaa niin paljon kuin sielu sietää.

      Mutta ei mene perille asti. Miksi Venäjä hyökkäisi Suomeen? No, tottahan se tietenkin on jos Suomi joka ei ole edes soda
      Maailman menoa
      299
      1686
    3. Mikä saa ihmisen tekemään tällaista?

      Onko se huomatuksi tulemisen tarve tosiaan niin iso tarve, että nuoruuttaan ja tietämättömyyttään pilataan loppuelämä?
      Sinkut
      246
      1557
    4. Minkä merkkisellä

      Autolla kaivattusi ajaa? Mies jota kaipaan ajaa Mersulla.
      Ikävä
      87
      1391
    5. IL - VARUSMIEHIÄ lähetetään jatkossa NATO-tehtäviin ulkomaille!

      Suomen puolustuksen uudet linjaukset: Varusmiehiä suunnitellaan Nato-tehtäviin Puolustusministeri Antti Häkkänen esittel
      Maailman menoa
      402
      1374
    6. Nyt kun Pride on ohi 3.0

      Edelliset kaksi ketjua tuli täyteen. Pidetään siis edelleen tämä asia esillä. Raamattu opettaa johdonmukaisesti, että
      Luterilaisuus
      398
      1292
    7. Kiitos nainen

      Kuitenkin. Olet sitten ajanmerkkinä. Tuskin enää sinua näen ja huomasitko, että olit siinä viimeisen kerran samassa paik
      Tunteet
      2
      1079
    8. Esko Eerikäinen tatuoi kasvoihinsa rakkaan nimen - Kärkäs kommentti "Ritvasta" lävähti somessa

      Ohhoh! Esko Eerikäinen on ottanut uuden tatuoinnin. Kyseessä ei ole mikä tahansa kuva minne tahansa, vaan Eerikäisen tat
      Suomalaiset julkkikset
      38
      1037
    9. Hyväksytkö sinä sen että päättäjämme ei rakenna rauhaa Venäjän kanssa?

      Vielä kun sota ehkäpä voitaisiin välttää rauhanponnisteluilla niin millä verukkeella voidaan sanoa että on hyvä asia kun
      Maailman menoa
      329
      874
    10. Miksi Purra-graffiti ei nyt olekkaan naisvihaa?

      "Pohtikaapa reaktiota, jos vastaava graffiti olisi tehty Sanna Marinista", kysyy Tere Sammallahti. Helsingin Suvilahden
      Maailman menoa
      257
      855
    Aihe