<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横向滑动案例的更多相关文章

  1. 横向滑动的HorizontalListView滑动指定位置的解决方法

    项目中用到了自定义横向滑动的控件:HorizontalListView,点击其中一项,跳转到另外一个大图界面,大图界面也是HorizontalListView,想使用setSelection方法设定 ...

  2. UICollectionView 图片横向滑动居中偏移量的解决

    1.在使用UICollectionView 来显示横向滑动图片的时候,cell与cell之间有间隙,每次滑动后cell都会向左偏移,在使用过这两个方法才解决每次向左偏移的部分. 2.使用方法前不要开启 ...

  3. 使GridView可以单行横向滑动

    最近做的练手的小项目中存在一个横向滑动的问题,需要HorizontalScroll中嵌套GridView,但是GridView默认是竖直排放的item,况且HorizontalScroll与GridV ...

  4. ios7中使用scrollview来横向滑动图片,自动产生偏移竖向的偏移 问题

    ios7中使用scrollview来横向滑动图片,自动产生偏移竖向的偏移 问题     如图红色为scrollview的背景色,在scrollview上加了图片之后,总会有向下的偏移 设置conten ...

  5. android--解--它们的定义tabhost(动态添加的选项+用自己的主动性横向滑动标签+手势切换标签页和内容特征)

    在本文中,解决他们自己的定义tabhost实现,并通过代码集成动态加入标签功能.自己主动标签横向滑动功能.和手势标签按功能之间切换. 我完成了这个完美的解决方案一起以下: 1.定义tabwidget布 ...

  6. overflow-x: scroll;横向滑动详细讲解

    overflow-x: scroll;横向滑动(移动端使用详解) css3 , ie8以上 <!DOCTYPE html> <html lang="en"> ...

  7. UITableView 的横向滑动实现

    UITableView 的横向滑动实现 概述 为了实现横向滑动的控件,可以继承类 UIScrollView 或类 UIView 自定义可以横向滑动的控件,这里通过 UITableView 的旋转,实现 ...

  8. 用css巧妙实现移动端横向滑动展示功能

    前言:记得以前处理移动端横向滑动展示都是去用js去解决的,要用js进行蛮多处理,要算li的宽度,然后还要用js设置ul盒子的宽度,又要设置最大滑动距离,最小滑动距离等等.......但是现在发现用cs ...

  9. iOS8 UICollectionView横向滑动demo

    在iOS8中,scrollView和加载在它上面的点击事件会有冲突,所以做一个横向滑动的界面最好的选择就是UICollectionView. 这个效果可以用苹果公司提供的官方demo修改而来,下载地址 ...

随机推荐

  1. Hybrid App 开发模式

    开发移动App主要有三种模式:Native. Hybrid 和 Web App. 需要注意的一点是在选择开发模式的时候,要根据你的项目类型(图片类?视频类?新闻类?等),产品业务和人员技术储备等做权衡 ...

  2. npm ERR! File exists: /XXX/xxx npm ERR! Move it away, and try again.

    今天抽空将我的静态服务 ks-server 之前留下的 bug(在node低版本情况下报错)维护了一下. 当我重新 npm link 时,如下错误: npm WARN ks-server@1.0.2 ...

  3. Git Learning2 GitHub upload

    1.在自己的github上创建一个仓库 2.git remote add [name] [link] 使用git来增加一个link的别名 3.git push [linkname] [分支名] 4.g ...

  4. element-UI表单验证

    转载自: 一.简单逻辑验证(直接使用rules) 实现思路 •html中给el-form增加 :rules="rules"•html中在el-form-item 中增加属性 pro ...

  5. python中一个汉字点3个字节? utf-8

    今天发现了一个汉字占了3个字节,一开始以为是两个呢,字符串切片时总出现乱码,后来才发现一个中文占3个字节.这才解决了乱码问题 原来  1. utf-8 编码中,一个汉字占三个字节.英文字母是一个占用一 ...

  6. Log4Net 常见错误提示(不断更新中)

    1. 无法识别log4中的节点,如:<section>等 解决办法:在configrition中直接申明log4 <configSections><!--必须为第一个节点 ...

  7. Mittag-Leffer函数, Matlab内部函数

    Mittag-Leffer函数: $E_{\alpha,\beta}(x) = \sum\limits^{\infty}_{k=0} \frac{x^k}{ \Gamma( \alpha k + \b ...

  8. LVM方式安装Ubuntu 系统

    重装Ubuntu系统,使用LVM管理磁盘,最好不要使用默认的LVM安装方式,而应挂载U盘启动盘,进行物理磁盘分区,创建物理卷.卷组.虚卷(即创建LVM系列操作),在安装系统时将虚卷挂载到文件目录上.将 ...

  9. Shell脚本【扔一百次硬币】

    #!/bin/bash#扔一百次硬币,然后分别显示出正面和反面的次数! for i in $(seq 100) do if [ `echo $((RANDOM%2))` == 0 ] then let ...

  10. LaLeX数学公式

    启用数学公式: 需要插入公式时,用 $ 将公式包围.若需要输入多行,则用一对 $$ 包围. 例如: $$ \rho = \sqrt{(\Delta x)^{2}+(\Delta y)^{2}} \\ ...