JavaScript瀑布流代码
function osCode(){
var boxWidth = parseInt($(".item").css('width')),
marginTop = parseInt($(".item").css('margin-top')),
marginLeft = parseInt($(".item").css('margin-Left')),
lineArr = [0,0,0],
nodes = $(".item");
for(var i=0;i<nodes.length;i++){
var minLine = Math.min.apply({},lineArr),
targetLine = 0;
for(var j in lineArr){
if(minLine==lineArr[j])
targetLine=j;
}
var aLeft = targetLine * boxWidth + targetLine * marginLeft;
nodes.eq(i).css({top:lineArr[targetLine]+"px",left:aLeft + 'px'});
var height = parseInt(nodes.eq(i).css('height'));
lineArr[targetLine]+=height+marginTop;
}
}
JavaScript瀑布流代码的更多相关文章
- javascript瀑布流效果
javascript瀑布流效果 其实javascript瀑布流 前几年都已经很流行了(特别是美丽说,蘑菇街),最近看到网上有人问这个瀑布流效果,所以自己有空的时候就研究了下,其实也是研究别人的代码,研 ...
- javascript瀑布流
哇,瀑布流,是的,不错,不错,真的不错,很好玩的样子,于是自己想玩玩啊,来吧,就玩起. 循序渐进,我这里采用原生的js代码来书写.为了方便大家运行代码,我就全部样式和CSS都写在html里面了,当然还 ...
- iOS开发:代码通用性以及其规范 第一篇(附带,自定义UITextView\进度条\双表显示\瀑布流 代码设计思路)
在iOS团队开发中,我见过一些人的代码,也修改过他们的代码.有的人的代码写的非常之规范.通用,几乎不用交流,就可以知道如何修改以及在它基础上扩展延生.有的人的代码写的很垃圾,一眼看过去,简直会怀疑自己 ...
- jquery实现简单瀑布流代码
测试环境:ie8 ff13.0.1 chrome22 可以将分页获取的内容依次填入四个div中,瀑布流的分页可以以多页(比如5页)为单位二次分页,这样可以减少后台算法的复杂度 <!DOCTYP ...
- Jquery简单瀑布流代码示例
最近很多网站都采用瀑布流风格设计,感觉挺有个性的,比较合适做图片类型的网站,没事仿开心网做一个瀑布流示例. 需要用到Jquery,jquery.masonry.min.js <!DOCTYPE ...
- ios图片瀑布流代码
ios瀑布流,实现简单的瀑布流视图布局,可以显示网络图片,下拉刷新,上拉加载更多. 下载:http://www.huiyi8.com/sc/9087.html
- JavaScript—瀑布流
现在网页中需要翻页的列表,好多都已经改为瀑布流了.所以这个思路还是特别重要的 HTML Css 页面 因为每个图片的高度不一样所以她的 top 和left 我们待会通过JS计算 动态生成 js部分 思 ...
- jq瀑布流代码
<style> #zh{ position:fixed; width:100%; height:100%; background:url(images/bgblack.png); top: ...
- web前端学习(四)JavaScript学习笔记部分(8)-- JavaScript瀑布流
index.html <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type&qu ...
随机推荐
- 【转载】【转自AekdyCoin的组合数取模】
本篇文章主要介绍了"[组合数求模] 转自AekdyCoin",主要涉及到[组合数求模] 转自AekdyCoin方面的内容,对于[组合数求模] 转自AekdyCoin感兴趣的同学可以 ...
- linux下的DNS
Linux下设置DNS的位置主要是, 1网卡设置配置文件里面DNS服务器地址设置;2 hosts文件指定 3.系统默认DNS服务器地址设置/etc/resolv.conf文件修改 生效顺序是: 1 h ...
- Revisit-after元标签是什么,SEO的作用是什么
很多网站都使用了revisit-after的问题,关于revisit-after这个标签是什么,revisit-after元标签的作用究竟是什么呢,应该如何使用revisit-after元标签呢? 这 ...
- 根据树父子ID拼接无限极树结构表的名称
declare @c varchar(50)set @c='572a3d51-ef7a-459e-a5cd-ebf0fca51e8b' --能查出来呀 你试试,我试一下,好像可以啦谢谢 declare ...
- UIButton, KVC, KVO
按钮 自定义按钮:调整内部子控件的frame 方式1:实现titleRectForContentRect:和imageRectForContentRect:方法,分别返回titleLabel和imag ...
- VB中后台打开Excel文件实现代码
某些时候需要打开Excel文件来获取或者写入数据,但又不希望跳出打开的Excel文件窗口,可以用下面的代码: Dim eb As New excel.Application, wb as excel. ...
- Android 添加菜单项
刚开始看郭大神的<>,实现以下里面的一些例子.利用Menu给APP添加一个菜单项. 效果图 结构图 在res的menu文件夹下创建一个xml文件,当然你也可以使用系统创建的main.xml ...
- Nhibernate 映射关系,一对多 多对一与多对手在映射文件中的体现。
今天做了第一个Nhibernate项目,摸着石头过河,学到了一些东西,在这里将自己总结体会到的一些映射关系写出来,与大家分享,由于是初学者,如果有不对的地方希望大家能够指出来. 首先要说明要建立的几张 ...
- Bitmap、BitmapDrawable、BitmapFactory、Matrix类之间的关系
1.BitmapFactory是一个工具类 Bitmap实现在android.graphics包中.但是Bitmap类的构造函数是私有的,外面并不能实例化,只能是通过JNI实例化.这必然是 某个辅助类 ...
- 浅析C++内存分配与释放操作过程——三种方式可以分配内存new operator, operator new,placement new
引言:C++中总共有三种方式可以分配内存,new operator, operator new,placement new. 一,new operator 这就是我们最常使用的 new 操作符.查看汇 ...