Indholdsfortegnelse
Der findes forskellige typer effekter og transformationer der kan anvendes på lærred, giver dette mulighed for at generere billeder, der før kun kunne forestilles i flash og andre lignende værktøjer.Blandt disse effekter har vi skabelse af skygger, der giver os mulighed for at give en lettelse til de tegninger, som vi inkorporerer i vores lærredDer er også gennemsigtighedseffekter, som giver os mulighed for at overlejre et element på et andet og generere uendelige designsandsynligheder.
Skygger
Skyggerne giver os mulighed for at give en dybde og relief effekt til vores elementer, på lærredet kan vi inkorporere disse skygger til elementerne, for dette har vi følgende egenskaber, der giver os mulighed for at tilpasse dem afhængigt af hvad vi vil opnå med dem:
- shadowBlur: Indstiller graden af skarphed af skyggen til en højere værdi, mindre skarphed og mere spredning af den.
- skyggeFarve: Giver dig mulighed for at indstille farven på skyggen.
- shadowOffsetX: Indstiller skyggens vandrette udgangspunkt.
- shadowOffsetY: Indstiller skyggens lodrette faldpunkt.
Eksempel Din browser understøtter ikke elementet lærred I dette eksempel anvender vi skygger på et rektangel samt tekst og en kurve, lad os se, hvordan dette ser ud i browseren:
For at etablere gennemsigtighed har vi to måder, den første er at bruge rgba funktion i attributter fillStyle Y slagtilfælde; den anden måde, vi har, er at bruge tegnegenskaben globalAlpha der gælder universelt.
Lad os se et eksempel nedenfor ved hjælp af den anden form, der er den enkleste og mest direkte at anvende, vi fremhæver, at de værdier, den accepterer globalAlpha er 0 for fuld gennemsigtighed Y 1 for at gøre det helt uigennemsigtigt, i tilfælde af eksemplet vil vi bruge 0,5 som en værdi, der tillader os en mellemvej:
Eksempel Din browser understøtter ikke elementet lærred Som vi kan se, var det, vi gjorde, at tegne et rektangel over teksten og takket være globalAlpha vi ser effekten af gennemsigtighed, der giver os mulighed for at sætte pris på de to tegn:
