Visa dagens namnsdag på din hemsida med javascript
Ladda ner
- NamedayHandler.js
- 11767 bytes
En trevlig funktion till hemsidan eller bloggen är att visa vilken namnsdag det är idag.
Med ett javascript du laddar ner här visar vi hur du gör för att visa svenska namnsdagar på din sida.
Här förklarar vi utförligt hur det går till.
Med ett javascript du laddar ner här visar vi hur du gör för att visa svenska namnsdagar på din sida.
Här förklarar vi utförligt hur det går till.
1. Ladda ner javascriptet
Hämta filen med javascriptet, den hittar du överst till höger på den här sidan i den svarta rutan med filer för nedladdning.
2. Spara filen till din hemkatalog och inkludera den på din sida
Det javascript du har hämtat behöver inkluderas på din sida. Det görs genom att lägga till det i en vanlig
<script> tag inuti <head> på din hemsida. Följande kodexempel visar hur det kan se ut:
<html>
<head>
<script type="text/javascript" src="/inc/js/NamedayHandler.js" charset="utf-8"></script>
<head>
<script type="text/javascript" src="/inc/js/NamedayHandler.js" charset="utf-8"></script>
3. Välj var på din hemsida du vill visa namnen
Det htmlelement som ska innehålla texten för namnsdagen är lämpligen någon av<span><div><h1>, <h2>, <h3> etc..
Det viktigaste är att den tag du väljer har ett unikt id. Exempel: har namnsdag idag.
Koden, exakt som den ser ut i exemplet ovan är:Det viktigaste är att den tag du väljer har ett unikt id.
Exempel: <span id="namnsdag"></span> har namnsdag idag.
Exempel: <span id="namnsdag"></span> har namnsdag idag.
4. Skapa klassen när sidan har laddat klart
Det sista som behöver göras är att skapa ett objekt av klassen, när sidan har laddat klart.
Det görs genom att lägga till en handler för
window.onload eller lägga till en
rad om det redan finns ett sådant anrop på sidan. För att då slutligen få ovanstående exempel
att fungera lägger vi till nedanstående, någonstans på sidan, antingen inom <head>
eller i <body> taggen.
<script type="text/javascript">
window.onload = function() {
new NamedayHandler({elm: "namnsdag"});
}
</script>
window.onload = function() {
new NamedayHandler({elm: "namnsdag"});
}
</script>
info@utvecklarna.se