镜头耀斑CSS3动画æ’ä»¶ï¼Œå®Œç¾Žçš„å¾®å¦™çš„æ‚¬åœæ•ˆæžœï¼Œå®žçŽ°äº’åŠ¨æ•ˆæžœã€‚æ‰€æœ‰çš„é•œå¤´è€€æ–‘éƒ½ä½¿ç”¨ç®€å•çš„jQueryå’Œå¯ä»¥å¿«é€Ÿé…ç½®æ ·å¼åœ¨CSS文件ä¸ã€‚
åªæ˜¯åˆ›å»ºä¸€ä¸ªç©ºçš„容器页é¢ä¸Šæ·»åŠ ä¸€ä¸ªlensFlare到任何地方。然åŽ,您å¯ä»¥å®šåˆ¶å®ƒéµå¾ªç”¨æˆ· é¼ æ ‡ç§»åŠ¨é€šè¿‡ä¸€ä¸ªç®€å•的设置。æä¾›äº†è®¸å¤šé€‰é¡¹,如下所示:
è¯¥æ¼”ç¤ºå±•ç¤ºäº†é¼ æ ‡é©±åŠ¨lensFlare默认设置。一个ä¸å¿ƒç‚¹ å®šä¹‰å’Œç”¨æˆ·é¼ æ ‡ç§»åŠ¨æŽ§åˆ¶è€€æ–‘è½´æ—‹è½¬ã€‚é™„åŠ çš„è®¾ç½®å¯ä»¥æŽ§åˆ¶çŽ¯çš„å¤§å°, è·ç¦»,ä¸é€æ˜Žç‰ç‰ã€‚所有å¯ç”¨çޝæ¸å˜çš„CSS。
å°†lensFlareæ–‡ä»¶æ·»åŠ åˆ°ä½ çš„é¡µé¢å‡†å¤‡ä½¿ç”¨:
<link rel="stylesheet" href="css/jquery-lensFlare.css" type="text/css" /><script src="js/jquery-2.1.3.min.js"><script src="js/jquery-lensFlare.js">
页é¢åŠ è½½æ—¶è°ƒç”¨lensFlareçš„å…ƒç´ :
$(document).ready(function(){ $('.myElement').LensFlare({ // 在这设置 });});
使用lensFlare设置æ¥å®šåˆ¶ä½ 喜欢的效果。
style用于生æˆçŽ¯ç±»ã€‚é»˜è®¤ä¸º1,生æˆlf1-ringç±»ã€‚ä½ å¯ä»¥æ·»åŠ æ›´å¤šçš„ç±»æ¥åˆ›å»ºæ‚¨è‡ªå·±çš„é¢„è®¾æ ·å¼2,lf2-ring。