有个瀑布型的布局需求,于是找了下,网上大部分用jquery控件,界面太复杂,看起来很笨重,我需求比较简单,于是只能自己写

其实原理就是用cs 去控制,那么我们只需要把对应的界面去规划就行了,比如,我一个页面要分成2列,然后呈现为瀑布型,就是两个ul

至于动态Repeater的绑定,我暂时只能想到用两个Repeater,然后绑定的时候,按照i%2==0 把一个集合拆成2个,分别绑定到对应的Repeater

效果如下

绑定部分,我感觉还是有改进空间,时间紧促,没时间去研究,有更方法的同学,欢迎指教。

完整代码:

http://download.csdn.net/detail/jine515073/9214077

自适应瀑布型布局(手机,PC全兼容)的更多相关文章

  1. 简单而兼容性好的Web自适应高度布局,纯CSS

    纯CSS实现的自适应高度布局,中间内容不符自动滚动条.兼容IE9以上.chrome.FF.关键属性是box-sizing: border-box. 不废话,直接上代码: <!doctype ht ...

  2. RelativeLayout中的格局,自适应宽度布局

    RelativeLayout中的布局,自适应宽度布局 该图片中为android布局:总布局为 RelativeLayoutAtLeft 为居左 <TextView android:backgro ...

  3. 手机PC文件传输

    QQ啥的现在直接无法全部退出,很纠结后台运行,时不时的来条消息,明明电脑QQ还开着,越来越流氓了. 服务端代码: <%@ Page Language="C#" %> & ...

  4. 自适应XAML布局经验总结 (一)原则和页面结构设计

    XAML布局回顾 Grid和StackPanel是核心布局,尤其以Grid最为重要. Grid是网格布局,XAML的设计者有可能参考了Html里的Table设计了Grid布局,但进行了改进.Html中 ...

  5. 手机pc显示不同的内容

    <script type="text/javascript"> // var txt = $('#sjyincang').html(); // alert(txt); ...

  6. 分享一款强大的图片查看器插件,手机PC 通吃,功能超级齐全!

    一款强大的图片查看器插件,手机PC 通吃,功能超级齐全! 地址:http://photoswipe.com/

  7. boostrap栅格系统自适应的布局

    1.栅格系统 ​ Bootstrap是基于移动优先的原则开发的,使用了一系列的媒体查询(media queries)方法,为我们的布局和界面创建自适应的的分界点.这些分界点主要是基于视口宽度的最小值, ...

  8. 自适应电脑、手机和iPad的网页设计方法

    随着3G的普及,越来越多的人使用手机上网. 移动设备正超过桌面设备,成为访问互联网的最常见终端.于是,网页设计师不得不面对一个难题:如何才能在不同大小的设备上呈现同样的网页? 手机的屏幕比较小,宽度通 ...

  9. rem - 移动前端自适应适配布局解决方案和比较(转载)

    原文链接:http://caibaojian.com/mobile-responsive-example.html 互联网上的自适应方案到底有几种呢?就我个人实践所知,有这么几种方案:· 固定一个某些 ...

随机推荐

  1. 重新认识Javascript的一些误区总结

    1.在函数内有没有var真的不一样 下面这样一段代码,在函数abc()中,创建了两个变量a, c,并在函数体之外进行alert,想看看有什么事发生: <script> function a ...

  2. spring中InitializingBean接口使用理解(转)

    InitializingBean接口为bean提供了初始化方法的方式,它只包括afterPropertiesSet方法,凡是继承该接口的类,在初始化bean的时候会执行该方法. 测试程序如下: imp ...

  3. 实现session(session数据)的共享,解决分布式session共享

    为什么要实现共享? 首先我们应该明白,为什么要实现共享,如果你的网站是存放在一个机器上,那么是不存在这个问题的,因为会话数据就在这台机器,但是如果你使用了负载均衡把请求分发到不同的机器呢?这个时候会话 ...

  4. C++生成斐波拉其数列

    该方法作为一种演示功能左右,运行较慢. #include <iostream> using namespace std; class Fibonacci{ public: int a, b ...

  5. [na]IP分片抓包实验

    这两点比较重要 1.IP+ICMP+DATA = 1500字节 2.ping size指定的是data的大小. 3,可以ping大包+不分片检测mtu(分片发生在出口,如果包尺寸大于接口ip mtu, ...

  6. Win7多用户情况下,指定某一用户为自动登陆-解决办法

    转自:http://sbiuggypm.themex.net/archives/605 许久没更新博客了,但从后台可以查看到,有不少朋友还是几乎每天来逛一逛,很对不起的是最近都没更新啥内容.真是不好意 ...

  7. ssl与tls的差别

    1)版本号:TLS记录格式与SSL记录格式相同,但版本号的值不同,TLS的版本1.0便 用的版 本号为SSLv3.1. 2) 报文鉴别码:SSLv3.0和TLS的MAC算法的范围不同,但两者的安全层度 ...

  8. angular中的jqLite所包含的jquery API

    Angular本身包含了一个叫做jqLite的可兼容性库. 使用过的angular.element()方法就返回一个jqLite对象,  jqLite是jQuery库的子集,它 允许Angular以跨 ...

  9. [Windows Azure] Managing SQL Database using SQL Server Management Studio

    Managing Windows Azure SQL Database using SQL Server Management Studio You can use Windows Azure SQL ...

  10. 每日英语:Pediatricians Set Limits on Screen Time

    Parents should ban electronic media during mealtimes and after bedtime as part of a comprehensive 'f ...