JQuery在PC端实现手机触屏垂直滑动效果
经常会遇到下拉框过长出现垂直滚动条的情况,有时候这个长度还是由用户来增加的。
比如:有一个评价菜单,单击它会出现一个浮层,这个浮层列出了很多评语,这些评语都是用户自己增加的,该帐号下的所有的用户增加的评价都会显示出来。很快这个浮层的长度就超过了窗口的长度,那就会出现滚动条,然后样式就丑爆了。
浮层的宽度本身就不宽,也就滚动条宽度的3-5倍,再就是滚动条的样式每个浏览器都不同。IE的滚动条只可以调整颜色,Chrome的滚动条颜色大小都可以改,Firfox的滚动条就直接没法改的。
个人觉得移动端的滑动效果挺方便实用的,于是想在pc端实现这个效果。水平滑动效果的代码网上其实已经有了,垂直滑动的我倒是没找着,所以自己整了一个。
HTML代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>test page</title>
<script type="text/javascript" src="jquery-1.12.1.js"></script>
<style type="text/css">
li {width: 75px; }
</style>
</head>
<body>
<div class="aa" style="border: 1px solid red;curs