按比例显示盒模型

固定盒子长宽比
通过设置高度为0 ; padding-bottom:%可以根据宽度设定盒子的比例
如果不知道上面的理论是什么,可以通过去传送门看看这个属性的详细说明。
% 定义基于父元素宽度的百分比下内边距。此值不会如预期地那样工作于所有的浏览器中。
显然有兼容性问题~不过触摸端我还没有看到不好用的所以,移动端开发可以尽量用。

关于页面加载后执行js的一点说道

之前做过一个页面图片处理的页面碰到过这个问题,今天回顾一下。

需求是页面会加载很多图片,加载图片后要对图片的位置、尺寸记录,然后缩放到指定大小,还要根据位置设置相应的弹出框。

那问题就是用一般的jquery{$(function(){})}无力解决这个问题,因为各个浏览器对处理顺序的解释不同。

chrom会在图片解析之前就执行函数,那么就判断不到图片正确的尺寸,页面就会错位。

js里面有个window.onload事件可以解决这个问题。

window.onload需要当页面完全加载完成的时候才会触发,包括图片、flash等富媒体。

DOMReady只判断页面内所有的DOM节点是否已经全部完成,至于节点中的内容是否加载完成并不关心。

(*摘自曹刘阳的《编写高质量代码——Web前端开发修炼之道》)