ÓÃJavascript»ñÈ¡Ò³ÃæÔªËØµÄλÖÃ
ÖÆ×÷ÍøÒ³µÄ¹ý³ÌÖУ¬ÄãÓÐʱºòÐèÒªÖªµÀ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ÊôÐÔ¾ÍÊÇÍøÒ³µÄ¾ø¶Ô´óС£¬Òâ˼¾ÍÊǹö¶¯Ìõ¹ö¹ýµÄËùÓг¤¶ÈºÍ¿í¶È¡£
·ÂÕÕgetViewport()º¯Êý£¬¿ÉÒÔд³ögetPagearea()º¯Êý¡£
¡¡¡¡function getPagearea(){
¡¡¡¡¡¡¡¡if (document.compatMode == "BackCompat"){
¡¡¡¡¡¡¡¡¡¡¡¡return {
¡¡¡¡¡
Ïà¹ØÎĵµ£º
·ûºÏ XHTML 1.0 Transitional
<!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" /> ......
ÔÎÄ£ºÁõÎä|JavascriptÔõôÔÚÁ½¸ö´°ÌåÖ®¼ä´«Öµ2-showModalDialog
ǰһƪÎÄÕÂJavascriptÔõôÔÚÁ½¸ö´°ÌåÖ®¼ä´«ÖµÖн²µ½ÁËÈçºÎÀûÓÃwindow.open()·½·¨´ò¿ªÐ´°Ì壬²¢ÔÚÁ½¸ö´°ÌåÖ®¼ä´«ÖµµÄ·½·¨¡£javascriptÖл¹ÓÐÒ»¸öº¯Êýwindow.showModalDialogÒ²¿ÉÒÔ´ò¿ªÒ»¸öд°Ì壬²»¹ýËû´ò¿ªµÄÊÇÒ»¸öģ̬´°¿Ú£¬ÄÇôÈçºÎÔÚ¸¸´°Ì ......
1. ±ê×¼µÄ·½·¨
<mce:script type="text/javascript"><!--
function openWin(src, width, height, showScroll){
window.showModalDialog (src,"","location:No;status:No;help:No;dialogWidth:"+width+";dialogHeight:"+height+";scroll:"+showScroll+";");
}
// --></mce:script> &n ......
1.document.formName.item("itemName") ÎÊÌâ
˵ Ã÷:IEÏÂ,¿ÉÒÔʹÓÃdocument.formName.item("itemName")»òdocument.formName.elements ["elementName"];FirefoxÏÂ,Ö»ÄÜʹÓÃdocument.formName.elements["elementName"].
½â¾ö·½·¨:ͳһʹÓÃdocument.formName.elements["elementName"].
2.¼¯ºÏÀà¶ÔÏóÎÊÌâ
˵Ã÷:IEÏÂ,¿ÉÒÔ ......