-
jQuery 优点支持连缀 隐式迭代查看全部
-
CSS3的瀑布流 利用columns 设置列的宽度即可查看全部
-
JS的瀑布流: 先算窗口的宽度除以图片的宽度算出列,然后求出第一行最小高度的图片,用他的index让下一行的第一张图 利用position:absolute 还要left定位在第一行最小高度的图片的下面left=Math.floor(img.width())*index查看全部
-
JS 原生态布局 jqueay 布局 css3 多栏布局查看全部
-
jq的遍历each查看全部
-
onscroll事件实现瀑布流布局的图片加载功能 【原理】 当滚动滚动条时,判断是否要加载新的图片,通过一个函数,返回布尔值。 需要加载的条件: 页面最下面的元素box在视口中露出一半的高度时,开始加载。具体计算:(scrollTop+可视宽口高度)>(box.offsetTop+自身高度一半)时,加载(如图所示)。 【知识点】 ①scrollTop标准模式和混杂模式的兼容问题。 标准模式--document.body.scrollTop 混杂模式--document.documentElement.scrollTop; 兼容的写法:var scrollTop = document.body.scrollTop||document.documentElement.scrollTop; ②当前浏览器的可视窗口的高度 标准模式--document.body.clientHeight 混杂模式--document.documentElement.clientHeight; ③三元运算符代替if..else(比较简便) ④数据加载:将来自后台的json数据渲染到前端 创建元素,将数据填进去(这里是img的src) ⑤document.createElement创建元素 parentObj.appendChild(obj);插入对象到尾部查看全部
-
瀑布流布局原理是内部元素绝对定位查看全部
-
var minH = Math.min.apply(null,hArr);//求数组hArr中的最小值;@瀑布流布局----2-5 JavaScript实现瀑布流布局中图片排序 【原理】第二行的第一个box排在第一行高度最矮的那个下面,第二个排在次矮的那个下面,以此类推。 需要一个数组,存放每行每个box的offsetHeight的数组查看全部
-
js下设置css属性:object.style.cssText:"width:"+...+"; margin:0 auto"获取元素的宽:.offsetWidth 获取窗口的宽:document.documentElement.clientWidth**offsetWidth属性包括padding在内的宽度,而不是元素的width值** offsetWidth = 内容宽度 + 内边距宽度×2 +边框宽度×2 【不包括外边距marginparent.getElementByTagName("*");获取当前元素下所有子元素查看全部
-
用padding而不用换margin的原因:js获取数据块的高度时( offsetHeight) 包括图片所在的盒子高度和数据块间的距离 offsetHeight包含padding的值而不能将margin的值计入在内查看全部
-
$(document).ready();是只要等html的DOM节点加载完毕就会触发,并不会等待资源全部加载完毕,包括图片,这样你的图片没有自身的高,所有就会出现这样都等高的情况,而$(window).on('load',function(){});会等资源全部加载完毕,也就图片加载进来了,有了自身的高查看全部
-
实现瀑布流布局的三种方法: js原生方法 jquery方法 css3的多栏布局查看全部
-
var scrollTop = document.body.scrollTop || document.documentElement.scrollTop//scrollTop指滚动条滚走的距离 var clientHeight = document.body.clientHeight || document.documentElement.clientHeight//clientHeight指可视窗口的高度 两者都存在浏览器兼容问题查看全部
-
js下设置css属性:object.style.cssText:"width:"+...+"; margin:0 auto"查看全部
-
获取元素的宽:.offsetWidth 获取窗口的宽:document.documentElement.clientWidth查看全部
举报
0/150
提交
取消