HTML | Icon per Klick ändern?

Hi,

ich nutze die fa-icons. Jetzt möchte ich, dass wenn man auf ein icon klickt, es sich ändert, ohne, dass die Seite neu lädt.

Danke im Voraus!

Answer 1

[Dreadrasur]

Angenommen das ist dein HTML:

<i id="Icon" class="fa fa-eur"></i>

Du möchtest nun, dass wenn das Eurozeichen da ist (so wie am Anfang), es durch ein Dollarzeichen ersetzt wird, und danach andersherum, etc. Mit jQuery ginge das so (habs nicht getestet):

$.ready () { 
  var icon = $('#Icon');
  $(icon).on(function () {
    $(icon).toggleClass('fa-eur fa-usd'); 
    //toggleClass() fügt eine Klasse zum Element hinzu, sollte sie noch nicht da sein. Falls doch, wird die Klasse stattdessen entfernt.
  }); // end on()
}; //end ready()

Answer 2

[stboy]

Du nutzt ansonsten bisher nur HTML und CSS? Du hast einfach Font Awesome, also die Schriften und die CSS, eingebunden oder noch andere Sachen, wie jQuery?

Was soll sich beim Klick auf das Symbol genau ändern?

Answer 3

[verreisterNutzer]

Dann wäre Javascript / Jquery am besten geeignet - schreib einfach eine onclick Funktion für das Icon

Answer 4

[Hacker69GER]

Es gibt sowas wie Suchmaschinen http://stackoverflow.com/questions/260857/changing-website-favicon-dynamically