ÓÃJavascript»ñÈ¡Ò³ÃæÔªËØµÄλÖÃ
×ªÔØ×Ô£ºhttp://www.ruanyifeng.com/blog/2009/09/find_element_s_position_using_javascript.html
Áíһƪ£ºhttp://blog.csdn.net/ivan820819/archive/2009/09/03/4515122.aspx
ÖÆ
×÷
ÍøÒ³µÄ¹ý³ÌÖУ¬ÄãÓÐʱºòÐèÒªÖªµÀij¸öÔªËØÔÚÍøÒ³ÉϵÄÈ·ÇÐλÖá£
ÏÂÃæµÄ½Ì³Ì×ܽáÁËJavascriptÔÚÍøÒ³¶¨Î»·½ÃæµÄÏà¹ØÖª
ʶ¡£
Ò»¡¢ÍøÒ³µÄ¾ø¶Ô´óСºÍÏà¶Ô´óС
Ê×ÏÈ£¬ÒªÃ÷È·Á½¸ö»ù±¾¸ÅÄî¡£
Ò»ÕÅÍøÒ³µÄÈ«²¿Ãæ»ý£¬¾ÍÊÇËüµÄ¾ø¶Ô´óС¡£Í¨³£Çé¿öÏ£¬ÍøÒ³µÄ¾ø¶Ô´óСÓÉÄÚÈݺÍCSSÑùʽ±í¾ö¶¨¡£
ÍøÒ³µÄÏà¶Ô´óСÔòÊÇÖ¸ÔÚä¯ÀÀÆ÷´°¿ÚÖп´µ½µÄÄDz¿·ÖÍøÒ³£¬Ò²¾ÍÊÇä¯ÀÀÆ÷´°¿ÚµÄ´óС£¬ÓÖ½Ð×öviewport£¨ÊÓ¿Ú£©¡£
ÏÂͼÖÐÑëµÄ·½¿ò¾Í´ú±íä¯ÀÀÆ÷´°¿Ú£¬Ã¿´ÎÖ»ÄÜÏÔʾһ²¿·ÖÍøÒ³¡£
£¨Í¼Ò» ÍøÒ³µÄ¾ø¶Ô´óСºÍÏà¶Ô´óС£©
ºÜÏÔÈ»£¬Èç¹ûÍøÒ³µÄÄÚÈÝÄܹ»ÔÚä¯ÀÀÆ÷´°¿ÚÖÐÈ«²¿ÏÔʾ£¨Ò²¾ÍÊDz»³öÏÖ¹ö¶¯Ìõ£©£¬ÄÇÃ´ÍøÒ³µÄ¾ø¶Ô´óСºÍÏà¶Ô´óСÊÇÏàµÈµÄ¡£
¶þ¡¢»ñÈ¡ÍøÒ³µÄÏà¶Ô´óС
ÍøÒ³ÉϵÄÿ¸öÔªËØ£¬¶¼ÓÐclientHeightºÍclientWidthÊôÐÔ£¬ÀûÓÃËüÃǾͿÉÒԵõ½ÍøÒ³µÄÏà¶Ô´óС¡£ÕâÁ½¸öÊôÐÔ´ú±íµÄ´óС£¬ÊÇÖ¸Ôª
ËØµÄÄÚÈݲ¿·ÖÔÙ¼ÓÉÏpaddingµÄ´óС£¬µ«ÊDz»°üÀ¨borderºÍ¹ö¶¯ÌõÕ¼ÓõĿռ䡣
£¨Í¼¶þ clientHeightºÍclientWidthÊôÐÔ£©
Òò´Ë£¬documentÔªËØµÄclientHeightºÍclientWidthÊôÐÔ£¬¾Í´ú±íÁËÍøÒ³µÄÏà¶Ô´óС¡£
function getViewport(){
¡¡¡¡¡¡¡¡if (document.compatMode == "BackCompat"){
¡¡¡¡¡¡¡¡¡¡¡¡return {
¡¡¡¡¡¡¡¡¡¡¡¡¡¡¡¡width: document.body.clientWidth,
¡¡¡¡¡¡¡¡¡¡¡¡¡¡¡¡height: document.body.clientHeight
¡¡¡¡¡¡¡¡¡¡¡¡}
¡¡¡¡¡¡¡¡} else {
¡¡¡¡¡¡¡¡¡¡¡¡return {
¡¡¡¡¡¡¡¡¡¡¡¡¡¡¡¡width: document.documentElement.clientWidth,
¡¡¡¡¡¡¡¡¡¡¡¡¡¡¡¡height: document.documentElement.clientHeight
¡¡¡¡¡¡¡¡¡¡¡¡}
¡¡¡¡¡¡¡¡}
¡¡¡¡}
ÉÏÃæµÄgetViewportº¯Êý¾Í¿ÉÒÔ·µ»Øä¯ÀÀÆ÷´°¿ÚµÄ¸ßºÍ¿í¡£Ê¹ÓõÄʱºò£¬ÓÐÈý¸öµØ·½ÐèҪעÒ⣺
1£©Õâ¸öº¯Êý±ØÐëÔÚÒ³Ãæ¼ÓÔØÍê³Éºó²ÅÄÜÔËÐУ¬·ñÔòdocument¶ÔÏó»¹Ã»Éú³É£¬ä¯ÀÀÆ÷»á±¨´í¡£
2£©´ó¶àÊýÇé¿öÏ£¬¶¼ÊÇdocument.documentElement.clientWidth·µ»ØÕýÈ·Öµ¡£µ«ÊÇ£¬ÔÚIE6µÄquirksģʽ
ÖУ¬document.body.clientWidth·µ»ØÕýÈ·µÄÖµ£¬Òò´Ëº¯ÊýÖмÓÈëÁ˶ÔÎĵµÄ£Ê½µÄÅжϡ£
3£©clientWidthºÍclientHeight¶¼ÊÇÖ»¶ÁÊôÐÔ£¬²»ÄܶÔËüÃǸ³Öµ¡£
Èý¡¢»ñÈ¡ÍøÒ³µÄ¾ø¶Ô´óС
document¶ÔÏóµÄscrollHeightºÍscrollWidthÊôÐÔ¾ÍÊÇÍøÒ³µÄ¾ø¶Ô´óС£¬Òâ˼¾ÍÊǹö¶¯Ì
Ïà¹ØÎĵµ£º
javascriptÖÐsetTimeout()º¯Êý
´ó¼Ò¶¼ÖªµÀjavascriptÖеÄsetTimeput()º¯ÊýµÄ×÷Óã¬Ò»°ã»áÓÃËûÀ´´¦ÀíһЩÁ¬ÐøµÄÊÂÇ飬ÃÇÏÈ¿´Ò»¸öÀý×Ó£º
<head>
<script>
function init()
  ......
JavaScript²»Çø·Öµ¥¸ö×Ö·ûºÍ×Ö·û´®£¬ÈκÎ×Ö·û»ò×Ö·û´®¿ÉÒÔÓÃË«ÒýºÅ»òµ¥ÒýºÅÒýÆðÀ´¡£Èç¹û×Ö·û´®±¾Éíº¬ÓÐË«ÒýºÅ£¬ÔòӦʹÓõ¥ÒýºÅ½«×Ö·û´®À¨ÆðÀ´£»Èç¹û×Ö·û´®±¾Éíº¬Óе¥ÒýºÅ£¬ÔòӦʹÓÃË«ÒýºÅ½«×Ö·û´®ÒýÆðÀ´£¬Á½Õß¿ÉÒÔǶÌ×ʹÓᣠ......
ÄãÖªµÀÊÀ½çÉÏÓжàÉÙÖÖä¯ÀÀÆ÷Â𣿳ýÁËÎÒÃÇÊìÖªµÄIE, Firefox, Opera, SafariËÄ´óä¯ÀÀÆ÷Ö®Í⣬ÊÀ½çÉÏ»¹Óнü°ÙÖÖä¯ÀÀÆ÷¡£
¼¸Ììǰ£¬ä¯ÀÀÆ÷¼Ò×åÓиյ®ÉúÁËһλСÍõ×Ó£¬¾ÍÊÇGoogleÍÆ³öµÄChromeä¯ÀÀÆ÷¡£ÓÉÓÚChrome³öÉúÃûÃÅ£¬¾¡¹ÜËû»¹ÊǸöС¼Ò»ï£¬Ã»ÓÐÈ˸ÒС¿´Ëû¡£ÒÔºó£¬ÔÛÃdz£Ëµä¯ÀÀÆ÷µÄ&ld ......
»¹²»Á˽âJSONÊÇʲô?¿´ÁËÏÂÃæÕâÆªÎÄÕ£¬Äú¶ÔJSONÊÇʲôӦ¸ÃÄܹ»ÓÐÁËÒ»¸ö±È½ÏÇåÎúµÄ¸ÅÄî¡£
¡¡¡¡JSON ¼´ JavaScript. Object Natation£¬ËüÊÇÒ»ÖÖÇáÁ¿¼¶µÄÊý¾Ý½»»»¸ñʽ£¬·Ç³£ÊʺÏÓÚ·þÎñÆ÷Óë JavaScript. µÄ½»»¥¡£±¾ÎĽ«¿ìËÙ½²½â JSON ¸ñʽ£¬²¢Í¨¹ý´úÂëʾÀýÑÝʾÈçºÎ·Ö±ðÔÚ¿Í»§¶ËºÍ·þÎñÆ÷¶Ë½øÐÐ JSON ¸ñʽÊý¾ÝµÄ´¦Àí¡£
¡¡¡¡¾¡¹ ......