Ò׽ؽØͼÈí¼þ¡¢µ¥Îļþ¡¢Ãâ°²×°¡¢´¿ÂÌÉ«¡¢½ö160KB

9 ¸ö»ùÓÚJavaScript ºÍ CSS µÄ Web ͼ±í¿ò¼Ü


      jQuery, MooTools, Prototype µÈÓÅÐãµÄ
JavaScript ¿ò¼ÜÓµÓи÷ÖÖÇ¿´óµÄ¹¦ÄÜ£¬°üÀ¨»æÖÆ Web ͼ±í£¬Ê¹ÓÃÕâЩ¿ò¼ÜÒÔ¼°ÏàÓ¦²å¼þ£¬ÎÒÃÇ¿ÉÒԷdz£ÇáËɵØʵÏÖÇúÏßͼ£¬Ô²±ýͼ£¬Öù״ͼµÈ
Web ͼ±íµÄ»æÖÆ£¬¶ø²»±ØÏóÒÔÍùÄÇÑùͨ¹ý¸´Ô Flash ¼¼ÊõʵÏÖ¡£±¾ÎĽéÉÜÁË9¸öÓÅÐãµÄ»ùÓÚ JavaScript Óë CSS  µÄ Web ͼ±í¿ò¼Ü¡£
jQuery, MooTools, Prototype µÈÓÅÐãµÄ JavaScript ¿ò¼ÜÓµÓи÷ÖÖÇ¿´óµÄ¹¦ÄÜ£¬°üÀ¨»æÖÆ Web
ͼ±í£¬Ê¹ÓÃÕâЩ¿ò¼ÜÒÔ¼°ÏàÓ¦²å¼þ£¬ÎÒÃÇ¿ÉÒԷdz£ÇáËɵØʵÏÖÇúÏßͼ£¬Ô²±ýͼ£¬Öù״ͼµÈ Web ͼ±íµÄ»æÖÆ£¬¶ø²»±ØÏóÒÔÍùÄÇÑùͨ¹ý¸´Ô Flash
¼¼ÊõʵÏÖ¡£±¾ÎĽéÉÜÁË9¸öÓÅÐãµÄ»ùÓÚ JavaScript Óë CSS µÄ Web ͼ±í¿ò¼Ü¡£
1.
Flot
Flot
ÊÇÒ»¸ö´¿´âµÄ jQuery JavaScript
»æͼ¿â£¬¿ÉÒÔÔÚ¿Í»§¶Ë¼´Ê±Éú³ÉͼÐΣ¬Ê¹Ó÷dz£¼òµ¥£¬Ö§³Ö·Å´óËõСÒÔ¼°Êó±ê×·×ٵȽ»»¥¹¦ÄÜ¡£¸Ã²å¼þÖ§³Ö IE6/7/8, Firefox 2.x+,
Safari 3.0+, Opera 9.5+ ÒÔ¼° Konqueror 4.x+¡£Ê¹ÓõÄÊÇ Safari ×îÏÈÒýÈëµÄ Canvas
¶ÔÏó£¬Ä¿Ç°ËùÓÐÖ÷Á÷ä¯ÀÀÆ÷¶¼Ö§³Ö¸Ã¶ÔÏ󣬳ýÁË IE, Òò´ËÔÚ IEÖÐʹÓà JavaScript ½øÐÐÄ£Äâ¡£ÕâÀïÓÐһЩʵÀý
¡£
2. JS Charts
JS Charts
ÊÇÒ»¸öÃâ·ÑµÄ»ùÓÚ JavaScript µÄͼ±íÉú³ÉÆ÷£¬±í¸ñ»æÖƷdz£¼òµ¥£¬¼¸ºõ²»ÐèÒª±àÂ룬Ҳ²»ÐèÒª²å¼þºÍ·þÎñÆ÷Ä£¿é£¬Ê¹ÓÃXML »ò JavaScript Êý×黺´æÊý¾Ý¡£
3. TableToChart
TableToChart
ÊÇÒ»¸ö MooTools ½Å±¾£¬¿ÉÒÔ½« HTML Table ¶ÔÏóÖд洢µÄÊý¾Ý»æÖƳÉͼ±í¡£Äã¿ÉÒÔʹÓà table ±êÇ©Éú³Éͼ±í£¬Öù״ͼ£¬ÇúÏßͼ£¬Ô²±ýͼµÈ¡£
4. PlotKit
PlotKit
ÊÇÒ»¸ö JavaScript »æͼ¿â£¬Ö§³Ö HTML Canvas ±êÇ©£¬Ò²Ö§³Ö SVG¡£
5. Yahoo UI Charts Control
YUI Charts Control
¿ÉÒÔÔÚÍøÒ³ÉϽ«±í¸ñÊý¾Ýת»»ÎªÍ¼±í£¬Ö§³ÖÖù״ͼ£¬ÇúÏßͼÒÔ¼°Ô²±ýͼ¡£Ö§³Ö DataSource ¹¤¾ß£¬¿ÉÉèÖõÄÖᣬÊó±êÅÌÐýÌáʾ£¬Í¼±í×éºÏ£¬ÒÔ¼°Æ¤·ôµÈ¹¦ÄÜ¡£
6. ProtoChart
ProtoChart
ÊÇÒ»¸ö»ùÓÚ Prototype ºÍ Canvas ±êÇ©µÄ¿ªÔ´¿â£¬Õâ¸ö¿âÉîÊÜ Flot
, Flotr, Plotkit µÈÆô·¢£¬Ö§³ÖÇúÏßͼ£¬Öù״ͼ£¬Ô²±ýͼµÈ£¬¿ÉÒÔÔÚͬһ¸öͼ±íÉÏÏÔʾ¶àÌ×Êý¾Ý£¬Ö§³Ö¿É¶¨ÖƵÄͼÀý£¬Íø¸ñ£¬±ß½çÒÔ¼°±³¾°Í¼¡£Ö§³Ö IE6/7, Firefox 2/3 ÒÔ¼° Safari£¬ÉõÖÁÖ§³Ö iPhone.
7. EJSChart
EJSChart
Ö§³ÖÊó±ê×·×Ù£¬Êó±êʼþ£¬°´¼ü×·×ÙÓëʼþ£¬Ëõ·Å£¬¹ö¶¯£¬½»»¥µÈ¹¦ÄÜ£¬½«Óû§ÌåÑéÉÏÉýµ½Ò»¸öи߶ȡ£Ö§³ÖÇúÏßͼ£¬Ãæ»ýͼ£¬Àëɢͼ£¬Ô²±ýͼ£¬Öù״ͼµÈÐÎʽ£¬


Ïà¹ØÎĵµ£º

³£ÓÃCSSÑ¡ÔñÆ÷


Ñ¡ÔñÆ÷ Óï·¨ ÃèÊö ʾÀý ±êÇ©Ñ¡ÔñÆ÷ E{ .....} ÒÔÎĵµÔªËØ×÷ΪѡÔñ·û td{font-size:14px;
    ......} IDÑ¡ÔñÆ÷ #ID{...} ÒÔÎĵµÔªËصÄΩһ± ......

´¿CSSʵÏÖÏÂÀ­Áбí

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>ÎÞ±êÌâÎĵµ</ ......

CSS Ñ¡ÔñÆ÷ÓÅÏȼ¶

CSSÓÅÏȼ¶°üº¬Ëĸö¼¶±ð£¨ÎÄÄÚÑ¡ÔñÆ÷£¬IDÑ¡ÔñÆ÷£¬ClassÑ¡ÔñÆ÷£¬ÔªËØÑ¡ÔñÆ÷£©ÒÔ¼°¸÷¼¶±ð³öÏֵĴÎÊý¡£¸ù¾ÝÕâËĸö¼¶±ð³öÏֵĴÎÊý¼ÆËãµÃµ½CSSµÄÓÅÏȼ¶¡£
CSSÓÅÏȼ¶µÄ¼ÆËã¹æÔòÈçÏ£º
* Ò³ÃæÖÐÖ±½ÓÉèÖÃstyle,¼Ó1,0,0,0
* ÿ¸öIDÑ¡ÔñÆ÷(Èç #id),¼Ó0,1,0,0
* ÿ¸öClassÑ¡ÔñÆ÷(Èç .class)¡¢Ã¿¸öÊôÐÔÑ¡ÔñÆ÷(Èç [attribute=])¡¢Ã¿¸ö ......

IE6,7,8,FF css hack

CSS¼æÈÝÐÔÒ»Ö±ÊÇ´ó¼ÒÍ·ÌÛµÄÎÊÌ⣬ÏÖÔÚ˵˵ÈçºÎÇø·ÖÕ⼸¸öä¯ÀÀÆ÷£¬IE6¡¢IE7¡¢IE8ºÍFF£¬IE8¾ùÖ¸IE8Õýʽ°æ,°æ±¾ºÅ:8.0.6001.18702¡£
ÒÔÑÕɫΪÀýÀ´ËµÈçºÎÇø·ÖÕ⼸¸öä¯ÀÀÆ÷£º
.csshack{
    color:#f00;               &nbs ......
© 2009 ej38.com All Rights Reserved. ¹ØÓÚE½¡ÍøÁªÏµÎÒÃÇ | Õ¾µãµØͼ | ¸ÓICP±¸09004571ºÅ