问题的描述:

在歌曲列表页面使用了scroll插件,搜索了很多歌曲,页面出现滚动,选择播放一首歌曲,弹出播放器,将播放器最小化,页面回到歌曲列表,并且页面的底部出播放歌曲的信息(在没有播放歌曲的时候是没有的),在这样的情况下,歌曲列表不能下拉到最后的一首歌,因为被当前播放的歌曲信息挡住了

问题的原因:

当播放器最小化的时候,这时会在页面底部显示一个小播放器,小播放器是通过绝对定位到底部的,它的zindex比歌曲列表的高,所以挡住了歌曲列表,只要让整个歌曲列表往上移动小播放器的高度即可

问题的解决:

由于播放器列表是fixed 定位的,小播放器的高度是60px,所以给包裹列表的div添加bottom = 60px 即可,但是有很多地方都有这样的情况,例如 播放历史记录,排行榜,最近播放等页面,所以写一个mixmin,里面添加一个方法,只要组件用添加了这个mixmin,那么必须实现该方法,在方法里添加bottom

better-scroll 遇到的问题 2的更多相关文章

  1. 【前端性能】高性能滚动 scroll 及页面渲染优化

    最近在研究页面渲染及web动画的性能问题,以及拜读<CSS SECRET>(CSS揭秘)这本大作. 本文主要想谈谈页面优化之滚动优化. 主要内容包括了为何需要优化滚动事件,滚动与页面渲染的 ...

  2. MUI开发APP,scroll组件,运用到区域滚动

    最近在开发APP的过程中,遇到一个问题,就是内容有一个固定的头部和底部.         头部就是我们常用的header了,底部的话,就放置一个button,用来提交页面数据或者进入下一个页面等,效果 ...

  3. 完美解决,浏览器下拉显示网址问题 | 完美解决,使用原生 scroll 写下拉刷新

    在 web 开发过程中我们经常遇到,不想让用户下拉看到我的地址,也有时候在 div 中没有惯性滚动,就此也出了 iScroll 这种关于滚动条的框架,但是就为了一个体验去使用一个框架好像又不值得,今天 ...

  4. offset、client、scroll开头的属性归纳总结

    HTML元素有几个offset.client.scroll开头的属性,总是让人摸不着头脑.在书中看到记下来,分享给需要的小伙伴.主要是以下几个属性: 第一组:offsetWidth,offsetHei ...

  5. mui scroll和上拉加载/下拉刷新

    mui中 scroll和上拉加载/下拉刷新同时存在会出现两个滚动条 把/*   */ /* //mui页面鼠标拖动代码: mui('.mui-scroll-wrapper').scroll({ dec ...

  6. JavaScript学习笔记5 之 计时器 & scroll、offset、client系列属性 & 图片无缝滚动

    一.计时器 setInterval ( 函数/名称 , 毫秒数 )表示每经过一定的毫秒后,执行一次相应的函数(重复) setTimeout ( 函数/名称 , 毫秒数 ) 表示经过一定的毫秒后,只执行 ...

  7. JavaScript中的 offset, client,scroll

    在js 中我们要用到的 offset, client, scroll 在这我把自己理解的给大家分享一下. offset div.offsetTop 指div距离上方或上层控件的距离,单位像素 div. ...

  8. 【前端性能】高性能滚动 scroll 及页面渲染优化--转发

    本文主要想谈谈页面优化之滚动优化. 主要内容包括了为何需要优化滚动事件,滚动与页面渲染的关系,节流与防抖,pointer-events:none 优化滚动.因为本文涉及了很多很多基础,可以对照上面的知 ...

  9. 由overflow-x:scroll产生的收获

    我们都知道float:left属性会让元素向左浮动,如果用一个div将几个左浮动的li包起来,是不是div的宽度被li撑得很长很长呢,代码: <!DOCTYPE html> <htm ...

  10. UGUI 之Scroll Rect 坑

    由于UGUI没有提供类似Scroll View类似的控件,但提供了ScrollRect主机.可以自定义Scroll View 同时提供了Mask组件来遮罩超出Scroll Rect对象的范围, 之所以 ...

随机推荐

  1. SP1811 LCS - Longest Common Substring

    \(\color{#0066ff}{ 题目描述 }\) 输入2 个长度不大于250000的字符串,输出这2 个字符串的最长公共子串.如果没有公共子串则输出0 . \(\color{#0066ff}{输 ...

  2. P1472 奶牛家谱 Cow Pedigrees

    题意:问你指定二叉树有几种 1.高度为k 2.节点数为n 3.每个点的度为0或2 爆搜------->30分QAQ 首先,因为每个节点度为0或2, 所以如果n是偶数直接输出0就行了吧(嘿嘿) 如 ...

  3. Codeforces Round #533 (Div. 2)题解

    link orz olinr AK Codeforces Round #533 (Div. 2) 中文水平和英文水平都太渣..翻译不准确见谅 T1.给定n<=1000个整数,你需要钦定一个值t, ...

  4. 牛客nowcoder NOIP普及组第三场

    qtmd AK了 直接题解吧 题目链接 A-十七边形 牛牛想在一个半径为r的圆中,找到一个内接的十七边形,使他的面积最大.输入半径r,输出最大的面积. 1 <= r <= 10000 在1 ...

  5. Tensorflow方法介绍

    一.reduce系列函数(维度操作) 1.tf.reduce_sum( input_tensor, axis=None, keep_dims=False, name=None, reduction_i ...

  6. Redis 工具类 java 实现的redis 工具类

    最近了解了一下非关系型数据库 redis 会使用简单的命令 在自己本地电脑 使用时必须先启动服务器端 在启动客户端 redis 简介 Redis是一个开源的使用ANSI C语言编写.支持网络.可基于内 ...

  7. win7 宽带连接 711错误

    新装Win7系统,建立宽带连接后提示711错误,网上转一圈,方法不少,对症下药,不是很管用 以下是我总结的方法 win7 旗舰版 administration 用户 设置以下几个服务为手动或自动,并启 ...

  8. P3943 星空

    传送门 观察题目数据,发现 k ≤ 8 ,可能可以从这里入手解决问题 考虑状态压缩 但是我们每次操作都会让一连串的序列改变,而序列的每个状态都是必须要知道的 很麻烦,所以考虑如何把一段区间表示地简单一 ...

  9. day_09 函数及参数

    1.定义:把功能封装起来,方便下次直接调用 2.语法:def 关键词开头,空格之后接函数名称和圆括号(). def 函数名(形参) 函数体 3.参数:圆括号用来接收参数.若传入多个参数,参数之间用逗号 ...

  10. 使用Spring和JQuery实现视频文件的上传和播放

    Spring MVC可以很方便用户进行WEB应用的开发,实现Model.View和Controller的分离,再结合Spring boot可以很方便.轻量级部署WEB应用,这里为大家介绍如何使用Spr ...