[JavaScript]Zdarzenie onmouseover Opcje

[adrianozo]

Witam wszystkich.
Zastanawia mnie jak zrobić jeden skrypt i jest to najprawdopodobniej w JavaScript. Będzie to także najprawdopodobniej zdarzenie onmouseover. Chodzi o to, że mam obrazek jakiś tam i takie kółka różnokolorowe. Gdy najadę myszką na dany kolor kółka, to kolor obrazka się zmieni na taki jaki ma kółko. Znalazłem taki skrypt w internecie, ale tylko taki, że jest podmieniany obrazek. Mnie zastanawia czy istnieje możliwość takie sytuacji jak opisałem powyżej, lecz żebym nie musiał tworzyć tylu obrazków o różnych kolorach ile jest tych kółeczek, tylko będzie jeden obrazek podstawowy, a jego kolor się będzie tylko zmieniał.

Mam nadzieję, że zostałem zrozumiany.
Proszę o pomoc.
Z góry dziękuje:)

[Wicepsik]

[HTML] pobierz, plaintext 
<div style="background-color:red; width:600px; height:600px;">
<img src="http://republika.pl/blog_lb_4778498/7322415/tr/hand-peace-2.jpg" style=" z-index:-1; opacity:0.5;"/>
</div>
[HTML] pobierz, plaintext 

[adrianozo]

Nie bardzo rozumiem...

[kamil4u]

~Wicepsik chyba źle zrozumiał. W jego kodzie zmień kolor "red" np. na "green" i zobacz efekt.

Co do problemu to:

Kod

<style>
div{ width: 25px; height: 25px; }
</style>
<script>
function change(col){ document.getElementById('test').style.backgroundColor = col; }
</script>

<div onmouseover="change(this.style.backgroundColor)" style="background-color: red;"></div>
<div onmouseover="change(this.style.backgroundColor)" style="background-color: green;"></div>
<div onmouseover="change(this.style.backgroundColor)" style="background-color: brown;"></div>
<div onmouseover="change(this.style.backgroundColor)" style="background-color: black;"></div>

<hr>

<div id="test"></div>

Jeżeli to również nie to opisz dokładniej. Oczywiście musisz sobie to "podrasować" trochę

[adrianozo]

Zmieniłem na onclick i działa tylko teraz pytanie mam obrazek

http://pawlowska.com.pl/foto-glowne/doniczka_scienna.png

i mam te kolory klikam na czerwony, to chcę, żeby ta doniczka zmieniła kolor na czerwony. Da rade tak zrobić?

[kamil4u]

Najłatwiej canvas-em. Poczytaj o tym (IMG:style_emoticons/default/smile.gif) Ew. przerób ten obrazek tak jak w przykładzie ~Wicepsik-a

[adrianozo]

Próbuje to teraz podrzucić pod PHP i mi coś nie idzie. Nie wiem dlaczego. Wiem że chyba tam jest coś nie tak bo tam jest backgroundColor, a ja wrzucam jako obrazek. Mógłby ktoś rzucić na to okiem fachowca?

Kod

<script type="text/javascript">
function change(col)
{
    document.getElementById('oferta_lewa').style.backgroundColor = col;
}
</script>
$zapytkon = mysql_query("SELECT * FROM kolory WHERE oferta = '$id'");
        echo 'Kolory:<br /><br />';
        while($wierszusiek = mysql_fetch_array($zapytkon))
        {
            echo '<div onclick="change(this.style.backgroundColor)"><img src="kolory/'.$wierszusiek['kolor'].'.png" alt="'.$wierszusiek['kolor'].'" /></div>';
        }

Działanie(a raczej nie działanie):

http://nportfolio.pl/doniczki/index.php?page=oferta&id=3