平常遇到大多数的带有列表的应用都会遇到这个场景:在列表顶端有一个Header,当向上滑动列表时,压缩header,向下滑动列表到头时,展开header.这种样式在例如微博,twitter这些展示动态的界面里很常见.这种效果怎么实现呢?下面介绍我用的方法. 新博客:wossoneri.com 先看一下效果图 首先看一下BiliBili客户端的视频浏览界面.默认界面Header完全展开,并且Header显示AV号(别乱想,就是视频编号了)以及播放按钮.滑动之后Header被压缩,按钮移到AV号左边.…
效果图如下:        #import <UIKit/UIKit.h> @interface AppDelegate : UIResponder <UIApplicationDelegate> @property (strong, nonatomic) UIWindow *window; @end #import "AppDelegate.h" #import "RootViewController.h" @interface AppDe…
MGSwipeTableCell是一个UITableViewCell的子类, 它实现了左,右滑动展开更多按钮用来实现一些相关操作就和QQ好友列表滑动展开的按钮一样,封装的很好,动画效果也处理很到位,废话不多说,我们来看下它的简单集成 1.写一个类来继承他,和UITableView一样的使用 2.设置代理delegate,并且实现协议MGSwipeTableCellDelegate的一些方法 1 #pragma mark - MGSwipeTableCellDelegate  callback:^…
查看本章节 查看作业目录 需求说明: 使用jQuery 中的显示与隐藏动画效果实现折叠下拉菜单的收缩和展开,在页面的列表中有若干项,列表的每项中有一个二级列表,二级列表默认为隐藏状态.点击列表的项,切换二级列表的显示或隐藏状态 实现思路: 在页面中添加<ul> 标签,用来显示无序列表.在<ul> 标签下添加两个<li> 标签,用来显示列表内容 在<li> 标签下添加两个<div> 标签,第一个显示一级列表的内容,第二个显示二级列表的内容 第二个&…
需求: 1.listview向下滑动时,隐藏顶部布局 2.listview向上滑动到最上面,显示顶部布局 3.顶部布局的隐藏和显示有过渡效果 4.第一次加载listview时,顶部不要隐藏 布局: 注意:android:animateLayoutChanges="true"添加在需要隐藏显示布局的父布局中才能有过渡效果 <?xml version="1.0" encoding="utf-8"?> <RelativeLayout…
手机屏幕毕竟有限,当我们要显示较多数据时便不得不舍去一些次要信息.将主要信息优先显示,也使显示效果更加简洁美观.遇到类似的需求,我们使用最多的就是 ListView ,而假设每次点击一个 Item 都要跳转到下一页查看详情,查看还有一个还要返回列表又一次进入还有一条详情.使得操作繁琐体验减少.此时可隐藏和展开 Item 的 ListView 便应运而生.这不是一个新的控件.仅仅是我们灵活使用造出来的使用方法.下边我就来实现 ListView 点击 Item 展开隐藏项,包含列表单项展开.多项展开…
页面使用overflow-scroll在iOS上滑动卡顿的问题 因在做一个滑动的list列表,为某个div使用了overflow: scroll属性. 结果在手机上测试时,ios手机有明显的滑动卡顿问题,而安卓手机不会出现该现象. 以下代码可解决这种卡顿的问题:-webkit-overflow-scrolling: touch;…
最近写了一个动画,下面来看看我以前写的一个上下滑动展开的按钮效果: 这类的效果经常会在一些网站页面下载按钮处看到,当你鼠标悬浮在下载按钮时,会提醒你是否已注册,或者点击登录什么的小提示~~~~~ 一.页面的主体布局 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <link type="text/css&q…
最近,公司在开发App的需求中增加了一个新的需求,要在android的页面中增加向右滑动的时候返回上一级页面.我刚知道这个需求的时候,感觉有点坑,可能设计那边最近接触到知乎的客户端或者是IOS的滑动可以返回上一级的效果,所以... 之前没有接触过android的滑动返回的开源库,所以还是找一下百度... 后来在Github上找到了SwipeBackLayout:GitHub地址是:https://github.com/ikew0ng/SwipeBackLayout 首先,我们先看一下这个开源项目…
1.效果及功能说明 hover事件制作产品图片鼠标滑过图片半透明,标题文字从左到右滑动动画移动显示隐藏 2.实现原理 首先把效果都隐藏,然后定义一个伪类来触发所有的效果,接下来当触发伪类后会有一个遍历停止所有的效果,从新触发效果就是标题的从左边淡出和背景颜色的变化,当鼠标离开图片后触发一个遍历,停止所有动画标题回到原处不见,背景颜色变回原样 主要的方法 $(".section  ul li").hover(function() //伪类的触发 $(this).find(".r…