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:)
Pełna wersja: [JavaScript]Zdarzenie onmouseover
Nie bardzo rozumiem...
~Wicepsik chyba źle zrozumiał. W jego kodzie zmień kolor "red" np. na "green" i zobacz efekt.
Co do problemu to:
Jeżeli to również nie to opisz dokładniej. Oczywiście musisz sobie to "podrasować" trochę
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>
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ę
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ć?
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ć?
Najłatwiej canvas-em. Poczytaj o tym 
Ew. przerób ten obrazek tak jak w przykładzie ~Wicepsik-a
Ew. przerób ten obrazek tak jak w przykładzie ~Wicepsik-a
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?
Działanie(a raczej nie działanie):
http://nportfolio.pl/doniczki/index.php?page=oferta&id=3
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>';
}
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
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.