css3左右滑动不显示滚动条,隐藏滚动条并用CSS左右滑动

我创建了一个框，我想在左右方向上水平滚动内容，并且想要使用触摸进行滑动并隐藏滚动条，这里是工作区JSfiddle隐藏滚动条并用CSS左右滑动

我应该尝试使用任何JSplugin来处理这个问题，还是这件事很容易实现？请建议

.spotlight_graphs {

bottom: 30px;

clear: both;

left: 0;

margin-left: auto;

margin-right: auto;

max-width: 360px;

overflow: auto;

position: absolute;

right: 0;

width: 100%;

background-color:#cbcbcb;

overflow:auto;

padding:10px;

}

.spotlight_graphs > ul {

font-size: 0;

list-style: outside none none;

margin: 0;

padding: 0;

text-align:left;

width:200%;

}

.spotlight_graphs > ul > li {

max-width: 90px;

width: 33%;

display:inline-block;

background-color:#dec8c8;

height:100px;

margin:0 5px 5px 0;

border:1px solid #333333;

}

.spotlight_graphs > ul > li > .graph_detail {

color: #404040;

float: left;

font-size: 14px;

text-align: center;

text-transform: uppercase;

width: 100%;

}

This is dummy title
This is dummy title
This is dummy title
This is dummy title
This is dummy title

在移动浏览器做，滚动条将不会显示在桌面浏览器。当您滑动时会出现一条细小的线条，插入其容器中，并且不会影响布局的任何内容。如果你愿意，你可以使用任何其他的jquery插件，例如http://nicescroll.areaaperta.com/demo.html。 –

css3左右滑动不显示滚动条,隐藏滚动条并用CSS左右滑动相关推荐

密码显示与隐藏效果 html+css+js
先看效果: 前言: 一般在我们要输入密码的时候都可以让自己输入的密码显示或者隐藏,所以我做了一个简约的密码框~ 实现: 定义html的输入框的标签,kuang为底层盒子,password为输入框,co ...
【Vue】滚动条（设置滚动条、滚动条样式、鼠标移入滚动条显示移出滚动条隐藏....）
目录设置滚动条滚动条样式 1.隐藏滚动条 2.常用滚动条的样式的示例滚动条的应用 1.标签页的内容滚动,标签头部固定 2.鼠标移入显示滚动条,鼠标移出隐藏滚动条 3.实现导航栏鼠标上滑显示下滑隐 ...
uniapp隐藏滚动条的几种方法
在pages.json里设置 //app页面不显示滚动条 "scrollIndicator": "none" 在uniapp的scroll-view组件中隐藏滚 ...
css局部上下滚动及隐藏滚动条
内外两个容器,外面的容器的高度装不下里面的容器时才会需要滚动,所以外面的容器要必须要设有height,overflow为auto或者scroll. <!DOCTYPE html> < ...
认识CSS中高级技巧之元素的显示与隐藏
前端之HTML,CSS(八) CSS高级技巧元素的显示与隐藏 CSS中有三个属性可以设置元素的显示于隐藏,分别是:display.visibility和overflow. display 隐藏元素: ...
html侧边栏添加滚动条,侧边栏滚动条
先来简单说说原理:监测浏览器滚动条的距离,大于一定长度时,给导航栏添加"position:fixed",小于则取消,同时还添加了animate自定义的透明度渐变过渡! 小小滚动条, ...
html div 隐藏滚动条样式,div滚动条样式隐藏与显示
DIV滚动条样式是可以设置的,CSS滚动条同样也可以显示与隐藏,对div设置滚动条,设置其横向滚动条和纵向滚动条样式应该怎么做呢? 要设置CSS滚动条样式,需要用到overflow-y和overflo ...
HTML 显示和隐藏浏览器滚动条
滚动条和overflow有关显示: overflow-x:auto; overflow-y:auto; overflow-x:scroll; overflow-y:scroll; 隐藏: overf ...
纯css隐藏移动端滚动条解决方案（ios上流畅滑动）
html代码展示(直接复制代码保存至本地文件运行即可): <!DOCTYPE html> <html lang="en"><head><m ...

css3左右滑动不显示滚动条,隐藏滚动条并用CSS左右滑动

css3左右滑动不显示滚动条,隐藏滚动条并用CSS左右滑动相关推荐

最新文章

热门文章