这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 一.需求来源 今天碰到了一个需求,需要在页面里,用水平瀑布流的方式,将一些图片进行加载,这让我突然想起我很久以前写的一篇文章<JS两种方式实现水平瀑布流布局> 但是有个问题,这个需求是Vue项目的,那没办法,这里给大家分享下我的开发过程,项目主体用的是之前在学习的CRMEB的后端框架来开发,UI使用iView-UI,其余的场景与其他的vue项目一致 二.逻辑设想 如果不是vue环境,我们的逻辑为 1.获取所有的div元素 2.获取盒…
讲到瀑布流分页有一个方法一定是要用到的 pullToRefresh() 这个也没什么好解释的,想了解的可以去百度一下 下面上代码 <div id="main" class="content" style="background-color: #FFFFFF; width: 100%;height:100%;position: absolute;overflow: hidden;"> <div class="list-m…
不知大家有没有发现,一般的图片展示网站都会使用瀑布流效果,所谓的瀑布流 就是网站内的图片不会一下子全缓存出来,而是等你滚动到一定的距离的时候, 下面的图片才会继续缓存,并且图片也是随机出现的,只是宽度一样,高度并不 一样,高高低低就像瀑布一样,所以叫做瀑布流效果.下面我把代码给大家,大家 随便下几张图片试试. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&qu…
先看效果: 初始状态:…
StaggeredGridView 开源lib  https://github.com/maurycyw/StaggeredGridView 文章demo下载地址  http://download.csdn.net/detail/u012303938/8883957 用imageloder去载入网络图片   用StaggeredGridView去显示实现瀑布流. MainActivity package com.origamilabs.library; import java.util.Arra…
搭建缘由 源于公司每次新启动一个由多人协同开发的项目都由负责人初始化项目之后,每个人再去从私服pull一下项目才开始开发.但是每次初始化工程都是一步步的造轮子,一个个依赖去安装,新建一个个不同功能的文件夹,而每个负责人所初始化的项目目录.以及模块引入方式参差不齐,以至于开发中后期因每个人开发风格的不同导致git提交时总会产生各种各样的“冲突”,也会产生后期代码维护成本增加,所以就有必要考虑一下做一个统一的类似“脚手架”的功能了,用来给团队开发带来便捷的.统一的.易扩展的项目基础. 预实现的功能…
vue-image-swipe 基于photoswipe实现的vue图片预览组件 安装 1 第一步 npm install vue-image-swipe -D 2 第二步 vue 入口文件引入 import Vue from 'vue' import VueImageSwipe from 'vue-image-swipe' import 'vue-image-swipe/dist/vue-image-swipe.css' Vue.use(VueImageSwipe) 使用 <template>…
http://blog.csdn.net/frankcheng5143/article/details/53185201 ************************************************************************ 文件上传是一个最基本的功能,往往我们需要对图片进行压缩,来加快移动端的加载速度. SprimgMVC图片上传可以参考SpringMVC传值 从这里开始 System.out.println("文件大小: " + file.…
今天在写项目用到Vue的时候,遇到的一个问题,纠结了好一会,首先我的代码是这样的 有没有毛病!!  开始我感觉是没啥毛病啊,按照之前写Java代码的逻辑,我感觉这没一点毛病 . 但是它就是有毛病, 假设在Java中,我们去操作这样两个数组的话,它们相互之间是不会受影响的,而我的问题就出在这,最后通过度娘解决了,原因是这个sizes和newsizes都是数组,并且他们都指向同一个地址res,数组有个特性就是它是引用数据类型,知道值传递和引用传递的区别,这一看就很明了了,引用的值sizes发生改变,…
  vue学习文档 http://www.jianshu.com/p/8a272fc4e8e8 vux github ui demo:https://github.com/airyland/vux Mint UI 项目主页:http://mint-ui.github.io/#!/zh-cn demo:http://elemefe.github.io/mint-ui/#/ github地址:https://github.com/ElemeFE/mint-ui 中文文档地址:http://mint-…