Antworten auf deine Fragen:
Neues Thema erstellen

Farbsimulator (Bildaustausch mit jQuery)

jhuhle93

Noch nicht viel geschrieben

Moin ihr Lieben!

Ich würde gerne eine Farbsimulation auf einer Webseite umsetzen, da ich aber noch totaler Anfänger in Sachen jQuery bin, weiß ich nicht so recht, wie ich da anfangen soll.

Ich habe oben einen Bereich für ein Bild und da drunter dann diverse div's mit einer Hintergrundfarbe. Je nach dem auf welche Farbe der User dann klickt, soll dann das entsprechende Bild zu der Farbe angezeigt werden.

Wie löst man sowas?

Momentan sieht es bei mir ungefähr so aus:

<div class="simulation-image">
<img class="bild1" src="bild1.jpg" width"100%" height="auto">
<img class="bild1" src="bild2.jpg" width"100%" height="auto">
<img class="bild1" src="bild3.jpg" width"100%" height="auto">
...
</div>
<div class="farben">
<div class"color-box box-color-1"></div>
<div class"color-box box-color-2"></div>
<div class"color-box box-color-3"></div>
....
</div>
 

msa1989

Bin da

Das ganze sollte so funktionieren:

Du hast dein "simulation-image" und je nachdem welche Farbe geklickt wird, tauscht dein jquery die "src" des Bildes aus.

Code:
<div class="simulation-image">
<img id="meinBild" src="aktuller Pfad" .../>
</div>

in jQuery kannst du z.B. mit
$("#meinBild").attr("src","dein neuer Bildpfad");
den jeweiligen Pfad ändern
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Neueste Themen & Antworten

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
118.619
Beiträge
1.538.363
Mitglieder
67.540
Neuestes Mitglied
Alex Weidner
Oben