瀑布流布局_技术问答

首页免费课瀑布流布局问答

瀑布流布局

                
                Amy
            
                    查看讲师更多课程 
                    Amy讲师的其他课程
                
CSS3实现漂亮ToolTips效果
初级·42722
免费课程
                                
css3实现网页平滑过渡效果
初级·54371
免费课程
                                
CSS3实现“图片阴影”效果
初级·34768
免费课程
                                
Tab选项卡切换效果
初级·65467
免费课程
                                
DOM事件探秘
中级·99544
免费课程
                                
                难度初级
            
                时长 2小时 0分
            
                学习人数
            
综合评分9.63
                            324人评价
                        查看评价
                                9.8
                                内容实用
                            
                                9.6
                                简洁易懂
                            
                                9.5
                                逻辑清晰

全部评论问答未解决精华

一个假前端

https://github.com/2017coding/-demo 一个简单的JSdemo，有瀑布流布局，css3d动画，网格布局，JS的本地存储等，有兴趣的同学看一下哦

0 1-1 瀑布流布局简介

2018-01-16

cyquan

css3的兼容性和机动性比较差，所以要稳定还是用JS/Jq

0 4-1 CSS3实现瀑布流布局

2018-01-13

慕粉1827178469

很喜欢这个老师讲的课，很仔细，很基础，都可以很容易看明白！点个赞

3 2-5 onscroll事件实现瀑布流布局的图片加载功能

2018-01-08

风雨断叼人

如果有同学做完后不能正确显示的话，可以查下jQuery是否正确引用，且jQuery的引用是第一条引用

2 3-1 jQuery实现瀑布流布局图片定位

2018-01-05

三都赋

这位老师讲的真心好，虽然我自己能写，但是我一直混用javaScript和jQuery,经过她一讲，明白多了

0 3-2 jQuery实现瀑布流布局的图片加载功能

2017-12-30

qq_駭泷_03817855

讲的太棒了，赞！!!

1 2-4 JavaScript实现瀑布流布局中图片排序

2017-12-30

慕尼黑1298850

加一个window.resize 里头调用waterfull
waterfull下面要改
if(index<cols){
len.push($(value).outerHeight())
$(value).css({"position":"absolute","top":0,"left":index*w})
}
就没bug了

1 3-2 jQuery实现瀑布流布局的图片加载功能

2017-12-18

慕尼黑1298850

加一个window.resize 调用waterfull
waterfull下面要改
if(index<cols){
len.push($(value).outerHeight())
$(value).css({"position":"absolute","top":0,"left":index*w})
}
就没bug了

1 3-2 jQuery实现瀑布流布局的图片加载功能

2017-12-18

慕尼黑1298850

??
jquery的是不是有问题

2 3-1 jQuery实现瀑布流布局图片定位

2017-12-18

IT种子选手

var dataInt={'data':[{'src':'1.jpg'},{'src':'2.jpg'},{'src':'3.jpg'},{'src':'4.jpg'}]};这里面写的图片多了，在开始加载时会有重叠现象

2 2-5 onscroll事件实现瀑布流布局的图片加载功能

2017-12-13

锦衣无涯

Math.min() 中参数只能接受数字的形式即：Math.min(1,2,3,4);
那我们需要判断的数据是数组的形式时该怎么办？
需要用到apply()方法，改方法有两个功能
1 改变this的指向（我看不懂请讲人话）
2 改变参数传入的形式（本节重点！）
使用了Math.min.apply(null,arr) 意味着我们可以向Math.min()传入一个数组。

1 2-4 JavaScript实现瀑布流布局中图片排序

2017-12-13

fengyunzhu

document.getelementsByClassName() IE9以上才支持，这个视频至少是2014年（看评论最早是2014年11月）甚至以前录的，那时候大部分网站还要求兼容IE6，7，8所以老师自己封装了一个getByClass

15 2-3 JavaScript实现瀑布流布局中图片定位

2017-12-06

慕粉1330329628

1、document.body.clientHeight获取的是body元素的高度；
2、视频中获取的最后一个.box元素offsetTop只是获取其相对于#main顶部的距离，应当使用
function getOffsetTop(ele) {
var height = 0;
while(ele.tagName !== "BODY"){
height += ele.offsetTop;
ele = ele.offsetParent;
}
return height;
}
这样才能得到最后一个.box元素与文档顶部的距离。

0 2-5 onscroll事件实现瀑布流布局的图片加载功能

2017-11-29