SCRIPT Emoticons op je website

SCRIPT Emoticons op je website

Webdesign | 24-04-2014 | Pascal Merks | Reacties


Altijd al smilies op je website willen hebben ;) . Dan laat ik je nu zie hoe dat moet :d ! Door onderstaand javascript op je pagina te zetten en de plaatjes map op je webserver te zetten kan je door een <div>, <p> of ander element class "entry-content" te geven bijvoorbeeld <p class="entry-content"> de aangegeven tekens in plaatjes laten veranderen :p ! Je kan het script zelf aanvullen met plaatjes en smilies die je zelf wilt :).

Link naar een voorbeeld: http://pmkmedia.nl/uploads/demos/smileys-2/test.html

Zip bestand met alle bestanden: http://pmkmedia.nl/uploads/smileys/smileys 2.0.zip

Code:

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
$(function() {
var c = document.getElementsByClassName('entry-content');
for (i=0; i<c.length; i++) {
c[i].innerHTML = c[i].innerHTML.replace(':)','<img src="smileys/glimlach.gif"/>');
c[i].innerHTML = c[i].innerHTML.replace(':d','<img src="smileys/lachen.gif"/>');
c[i].innerHTML = c[i].innerHTML.replace(';)','<img src="smileys/knipoog.gif"/>');
c[i].innerHTML = c[i].innerHTML.replace(':(','<img src="smileys/verdrietig.gif"/>');
c[i].innerHTML = c[i].innerHTML.replace(':p','<img src="smileys/tong.gif"/>');
c[i].innerHTML = c[i].innerHTML.replace(':|','<img src="smileys/verbaasd.gif"/>');
}
});
</script>

 

Dat was het veel plezier er mee!

 

Update:

Versie 2.0

Link: http://pmkmedia.nl/uploads/smileys/smileys 2.0.zip

In deze versie is het volgende aangepast:

  • Meer emoticons (in hogere resolutie)

 

Reacties:

comments powered by Disqus

Laatst toegevoegd

Categorieën

Laatste reacties

Laatste tweets