Spotlight
Die Widgetkit Spotlight laat jou toe om ‘n overlay oor jou grafika te plaas wat vervaag of beweeg as jy jou muis daaroor hou.
Voorbeeld
As geen eie overlay gestel is, is die default spotlight soos bo beskryf. Jy kan egter ook kies uit die volgende –fade
, bottom
, top
, right
en left
.
Hoe om te gebruik
Gebruik die HTML5 custom data attributedata-spotlight
om die spotlight te aktiveer.
<a data-spotlight="on" href="/mypage.html"> <img src="/image.jpg" width="180" height="120" alt="" /> </a>Om jou eie overlay te definieer, gebruik ‘n div element met die CSS class
overlay
. Jy kan die volgende parameters stel:
<a data-spotlight="effect:bottom;" href="/mypage.html"> <img src="/image.jpg" width="180" height="120" alt="" /> <div class="overlay">Custom Overlay</div> </a>Jy kan die parameter vir die effek stel na
fade
, bottom
, top
, right
en left
.