html横向滑动案例
<style type="text/css">
.outer-container,.content {width: 630px; height: 185px;padding-left: 8px;}
.outer-container {overflow: hidden;width: 100%;}
.inner-container {overflow:scroll;}
.inner-container::-webkit-scrollbar {display: none;}
.swiper-box{display: inline;margin-right: 8px;}
.swiper-box img{height: 165px;}
</style>
<div class="outer-container">
<div class="inner-container">
<div class="content">
<div class="swiper-box" data-id='3'>
<img src="../img/ios/taocan1.png">
</div>
<div class="swiper-box" data-id='3'>
<img src="../img/ios/taocan2.png">
</div>
<div class="swiper-box" data-id='3'>
<img src="../img/ios/taocan3.png">
</div>
<div class="swiper-box" data-id='3'>
<img src="../img/ios/taocan4.png">
</div>
</div>
</div>
</div>
html横向滑动案例的更多相关文章
- 横向滑动的HorizontalListView滑动指定位置的解决方法
项目中用到了自定义横向滑动的控件:HorizontalListView,点击其中一项,跳转到另外一个大图界面,大图界面也是HorizontalListView,想使用setSelection方法设定 ...
- UICollectionView 图片横向滑动居中偏移量的解决
1.在使用UICollectionView 来显示横向滑动图片的时候,cell与cell之间有间隙,每次滑动后cell都会向左偏移,在使用过这两个方法才解决每次向左偏移的部分. 2.使用方法前不要开启 ...
- 使GridView可以单行横向滑动
最近做的练手的小项目中存在一个横向滑动的问题,需要HorizontalScroll中嵌套GridView,但是GridView默认是竖直排放的item,况且HorizontalScroll与GridV ...
- ios7中使用scrollview来横向滑动图片,自动产生偏移竖向的偏移 问题
ios7中使用scrollview来横向滑动图片,自动产生偏移竖向的偏移 问题 如图红色为scrollview的背景色,在scrollview上加了图片之后,总会有向下的偏移 设置conten ...
- android--解--它们的定义tabhost(动态添加的选项+用自己的主动性横向滑动标签+手势切换标签页和内容特征)
在本文中,解决他们自己的定义tabhost实现,并通过代码集成动态加入标签功能.自己主动标签横向滑动功能.和手势标签按功能之间切换. 我完成了这个完美的解决方案一起以下: 1.定义tabwidget布 ...
- overflow-x: scroll;横向滑动详细讲解
overflow-x: scroll;横向滑动(移动端使用详解) css3 , ie8以上 <!DOCTYPE html> <html lang="en"> ...
- UITableView 的横向滑动实现
UITableView 的横向滑动实现 概述 为了实现横向滑动的控件,可以继承类 UIScrollView 或类 UIView 自定义可以横向滑动的控件,这里通过 UITableView 的旋转,实现 ...
- 用css巧妙实现移动端横向滑动展示功能
前言:记得以前处理移动端横向滑动展示都是去用js去解决的,要用js进行蛮多处理,要算li的宽度,然后还要用js设置ul盒子的宽度,又要设置最大滑动距离,最小滑动距离等等.......但是现在发现用cs ...
- iOS8 UICollectionView横向滑动demo
在iOS8中,scrollView和加载在它上面的点击事件会有冲突,所以做一个横向滑动的界面最好的选择就是UICollectionView. 这个效果可以用苹果公司提供的官方demo修改而来,下载地址 ...
随机推荐
- 防cc攻击策略
黑客攻击你的网站,会采取各种各样的手段,其中为了降低你网站的访问速度,甚至让你的服务器瘫痪,它会不断的刷新你的网站,或者模拟很多用户同一时间大量的访问你的网站, 这就是所谓的CC攻击,这就需要我们在程 ...
- ConcurrentHashMap为何不会出现ConcurrentModificationException异常
- DPDK kni创建要先于port开启
DPDK kni创建要先于port开启 1. DPDK kni创建使用API:- rte_kni_init- rte_kni_alloc 2. DPDK port开启使用API:- rte_eth_d ...
- 浅谈UML中常用的几种图——用例图
1.UML简介 统一建模语言(Unified Modeling Language,UML)又称标准建模语言,是始于1997年的一个OMG标准,它是一个支持模型化和软件系统开发的图形化语言,为软件开发的 ...
- tomcat发布项目如何通过域名直接访问
首先在服务器中找到tomcat安装后的文件夹,进入到conf目录下,找到server.xml文件 打开并修改,修改如下: 第一步:修改port,该值默认为8080,将其修改为80 第二步:修改defa ...
- MQ & RPC 消息队列与RPC的区别与使用场景
MQ: 区别:面向数据.生产者与消费者.有缓冲节点.异步.系统级/模块级通信 选型:RabbitMQ.ActiveMQ/Apollo.ZeroMQ.memcacheQ.Redis.MSMQ.kafk ...
- FPM四:用OVP做查询跳转到明细
前面做了查询的UIBB配置,在这边可以直接复用,查询的feeder class也就自动复用了. 1.给查询的feeder class添加接口,继续继承form的接口. 2.挨个实现每个方法,即使是用不 ...
- 移动端input输入placeholder垂直不居中
在移动端编写input输入框时候,为了输入文字与输入框垂直居中,一般情况下,会将input的line-height的高度等于height.但在移动端输入的时候会发现,虽然输入内容确实是垂直居中了,但是 ...
- Python数据类型——字符串
概论 字符串顾名思义就是一串字符,由于Python中没有“字符”这种数据类型,所以单个的字符也依然是字符串类型的.字符串可以包含一切数据,无论是能从键盘上找到的,还是你根本都不认识的.与数一样,字符串 ...
- windows硬盘优化篇
1.数据收集(默认的族分配为4096 bytes.最好只使用第一次的计算结果,以后再运算值会一直增加.计算软件“Cluster Size Calculator”) ------------系统为w7 ...