Design 8 - Javascripts
Originalen til dette detsign er hentet fra curvycorners. Der indgår to javascript-filer, som begge indlæses i sidens header:
- rounded_corners_lite.inc.js
- radius.js
Det første javascript - rounded_corners_lite.inc.js - er ret stort, men da du alligevel ikke skal ændre noget i det, vil jeg ikke gengive det her. Det andet script - radius.js - er der, hvor du definerer radius på boksenes hjørner. Da scriptet tilmed ikke er så voldsomt, kommer det her:
window.onload = function()
{
settings = {
tl: { radius: 15 },
tr: { radius: 15 },
bl: { radius: 15 },
br: { radius: 15 },
antiAlias: true,
autoPad: true,
validTags: ["div"]
}
var myBoxObject = new curvyCorners(settings, "myBox");
myBoxObject.applyCornersToAll();
}
Radius i hjørnernes runding defineres i pixels i de fire linjer med { radius: 15 }. Sættes radius til 0, fås et almindeligt skarpt hjørne.
I linjen validTags: ["div"] kan man definere de html-elementer, som man vil kunne bruge funktionen på. De enkelte elementer skrives ind i den firkantede parentes, adskildt med et komma og med anførselstegn om hvert element: validTags: ["div","code"].
