页面容器（#wrap）与页面头部（#header ）为width:100%宽度，内容的容器（#page）为固定宽度width:960px时，浏览窗口缩小而小于内容层宽度时会产生宽度理解上的差异。 拖动水平滚动条，右边的背景不存在了，出现bug的样子。 问题的根本在于：当窗口缩小时，浏览器默认100%宽度为浏览器窗口的宽度。而忽略了下部内容层固定宽度(960px)。从而出现了固定宽度大于100%宽度的现象。浏览以此理解来解析页面，就出现了容器宽度理解上的差异，出现了一个非常奇特的BUG。 问题的解决方法：既然是宽度理解上的差异...
alert($(window).height()); //浏览器当前窗口可视区域高度 alert($(document).height()); //浏览器当前窗口文档的高度 alert($(document.body).height());//浏览器当前窗口文档body的高度 alert($(document.body).outerHeight(true));//浏览器当前窗口文档body的总高度 包括border padding margin alert($(window).width()); //浏览器当前窗口可视区域宽度 ...
![[网页或屏幕宽高]javascript中top、clientTop、scrollTop、offsetTop等的用法](https://www.tddx.net/content/uploadfile/201311/thum-ed151383451489.gif)
js中常用宽度高度表达方式（详情见图）： 网页可见区域宽： document.body.clientWidth 网页可见区域高： document.body.clientHeight 网页可见区域宽： document.body.offsetWidth (包括边线的宽) 网页可见区域高： document.body.offsetHeight (包括边线的宽) 网页正文全文宽： document.body.scrollWidth 网页正文全文高： doc...
<script type="text/javascript"> if( $.browser.msie && ( $.browser.version == '6.0' || $.browser.version == '7.0' ) ){ // 如果符合条件，弹出提示，升不升级是他们的选择，我觉得不需要强制。 alert("您的浏览器版本过低，请尽快升级，否则会影响网页性能和操作！"); // 如果一定要强制的话，在这里加一句代码。 return; } </script> // $.browser.msie 这个是判断是...
需要加载jQuery库 HTML代码： <!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=utf-8" />...
打开网页右下角弹出窗口，相信经常浏览网页的人已经非常熟悉，这咱弹窗效果最常用的就是广告和网站公告了，一打开网页就会弹出来，广告效果非常好，通过javascript实现的代码： <!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> <title&...
先看下面一段代码： <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>IE6 position:fixed bug</title> <style> *{padding:0;margin:0} p{height:2000px} #gs{border:1px solid #000;position:fixed;r...
网站经常用到的jQuery幻灯片，需要元素结构很简单，只需要调用函数。 jQuery部分代码： $(function(){ $("#KinSlideshow").KinSlideshow({ moveStyle:"right", titleBar:{titleBar_height:30,titleBar_bgColor:"#08355c",titleBar_alpha:0.5}, titleFont:{TitleFont_size:12,TitleFont_color:"#FFFFFF",TitleFont_weight:"normal"}, ...
一个简单实用jquery tab选项卡，鼠标滑过切换，找了很久这种代码简单的，其他的写得都比较复杂，代码比较多： HTML代码部分： <div class="tabbox" id="statetab"> <ul class="tabbtn"> <li class="current"><a href="">php900</a></li> <li><a href="#">分享一</a></li> <li><a h...
看下面这段HTML代码： <div id="test"> <div> <div>a</div> <div>b</div> <div>c</div> </div> <div> <div>d</div> <div>e</div> </div> </div> 我们可以分别执行下面两条语句： alert($('#t...
动态改表格的 CSS 样式 document.getElementById(shui2).style.border-bottom="1px solid #000000" 这句 style.border-bottom 该怎么写总提示缺少对像 换成 style.border 可以。 用Javascript来控制CSS属性时，是驼峰式写法，即：去掉短横线，除第一个单词全部小写外，其余单词的首字母大写。 这个例子的正确写法是： document.getElementById("shui2").style.borderBottom="1px solid ...
黑白照片 filter: gray; X光照片 filter: Xray; 风动模糊 filter: blur(add=true,direction=45,strength=30); 正弦波纹 filter: Wave(Add=0, Freq=60, LightStrength=1, Phase=0, Strength=3); 半透明效果 filter: Alpha(Opacity=50); 线型透明 filter: Alpha(Opacity=0, FinishOpacity=100, Style=1, StartX=0, StartY=0, FinishX=100, F...