首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    项目需求讨论-自定义滚轮

    这次是关于滚轮方面需求,美工又出难题了。叫开发做一个滚轮,实现的效果如下GIF图所示: ? 需求: 滚轮进行滚动,并且要求是循环滚动。就是比如从A滑到了G,继续滑动又到了A。...比如A项已经滚到了中间了,然后要再点击中间那一项,然后滚轮上面空白界面相应的界面会被更新,只能点击滚轮中间那项部分,其他的点击没效果。...开始起航: 我们就一步步来,先做一个滚轮,我们知道,滚轮具有滚动效果,所以我们就直接让我们自定义滚轮继承ScrollView。...从上面的GIF图可知,我们的滚轮显示在界面上的是有五项,也就是我们比如规定我们的每项的高度是50dp,那我们的自定义滚轮就是每项的高度乘以你要显示在界面的个数(50dp X 5 = 250dp)。...这时候的距离才是真正的滚轮停止的位置。

    75320

    jquery 滚轮插件 示例 - 整屏滚动

    编写通过滚轮上下切换这五个屏幕效果。 要做出这个效果,其实不用说,首先要把这五个div的基本HTML+CSS给写出来先。 准备好五个图片 ? 001.png ? 002.png ?...在下面实现代码的时候需要使用定时器来控制函数节流,因为鼠标的滚轮事件触发非常快,必须限制之后才能有较好的体验,概念如下。...函数节流 javascript中有些事件的触发频率非常高,比如onresize事件(jq中是resize),onmousemove事件(jq中是mousemove)以及上面说的鼠标滚轮事件,在短事件内多处触发执行绑定的函数...clearTimeout(timer); timer = setTimeout(function(){ // 滚轮向上...:event.deltaY = 1 // 滚轮向下:event.deltaY = -1 $nowIndex = $nowIndex

    4.6K20

    Vue&uni-app swiper 轮播支持鼠标滚轮实现

    今天领导在用的时候提出一个问题:你这个不支持鼠标滚轮啊?我就比较疑惑 uni-app 是移动端场景啊,谁用手机还外接个鼠标啊。...      this.swiper.curDot++     } else {       this.swiper.curDot--     }   } } 2、在 Mounted () 方法里监听鼠滚轮...mounted () {   // 监听鼠标滚轮   window.addEventListener('mousewheel', this.handleScroll, false) } 现在,滚动鼠标滑轮试一下...不过有个问题,不管鼠标滚轮上滑还是下滑, swiper 都是往下翻的。 还需要再改造一下: 鼠标滑轮滚动的时候会有一个 deltaY 属性,正直(100)为往下滑动,负值(-100)为向上滑动。...未经允许不得转载:w3h5 » Vue&uni-app swiper 轮播支持鼠标滚轮实现

    1.2K40
    领券