ionic3在ios上拖动页面垂直滚动出屏幕,卡死,稍后一会才正常 5C

ionic3项目在ios上,手指拖动页面滚出屏幕外再松开手指,页面触发阻尼回弹回到原来页面,这时候再拖动页面,无法拖动,需要稍等几秒才能操作

0

2个回答

// 控制ios上滑动卡死的问题
-webkit-overflow-scrolling: auto!important;
全局使用了这个属性,在ios上会不像以前滚动流畅,不过能接受,也不会轻易卡死了

0

请问答主还有其他解决方案吗

webkit-overflow-scrolling: auto!important;
全局使用了这个属性,太不流畅了 失去了体验性。

0
Z_pigeon
Z_pigeon 我没有其他法子,在卡死与不流畅面前选一个。总结应该是ionic不适合做网页,以后不会再这样操作
29 天之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
ionic3 IOS真机测试BUG记录(持续更新中...)
1.ios默认没有键盘的取消按键需要使用到cordova键盘插件 。 【例】this.keyboard.hideKeyboardAccessoryBar(false); //使用下一个,上一个和完成按钮隐藏键盘附件栏。 2.ios端div(非button和)点击事件有300ms左右延迟,需在有click事件的地方加上 tappable 属性。 【例】tappable (click
ionic3 踩坑、滚动页面时 (ios) safari橡皮筋效果
-webkit-overflow-scrolling:auto | touch | [initial | inherit | unset | revert]; 用ionic3做手机通讯录,拖动右边字母索引控制联系人(scroll-content元素)滚动时, 在ios中ionic页面会跟着一起滚动。原因就是:    1、ios 中ionic内置浏览器为Safari,    2、她实现了-webki...
ionic3 滚动页面时 (ios) safari橡皮筋效果
-webkit-overflow-scrolling:auto | touch | [initial | inherit | unset | revert];  用ionic3做手机通讯录,拖动右边字母索引控制联系人(scroll-content元素)滚动时, 在ios中ionic页面会跟着一起滚动。 原因就是:     1、ios 中ionic内置浏览器为Safari,     2、她实...
ionic开发——内容超出滚动,水平滚动,垂直滚动及ios无法滚动问题
在angualarjs和ionic 开发中,直接设置CSS样式overflow:scroll或者overflow:auto;可能在ios上并无法实现滚动的效果。 在ionic中,他有专有的滚动条的功能。我们直接用它的就好了。 //具体参数说明 [delegate-handle=""] 该句柄利用$ionicScrollDelegate指定滚动视图
Ionic 3 在 ios 平台下禁用上下拖动效果
使用 Cordova 进行跨平台应用开发时,发现在 ios 平台下,如果页面处于最顶端时,用手指向下拖动,会露出空背景。同样页面在最底部的时候,继续向上拖动,下方也会露出空背景。 要禁止这个拖动效果,可在 config.xml 中进行如下设置: <preference name="webviewbounce" value="false" /> ...
ion-content无法滚动问题
最近碰到一个问题,页面上部需要固定,下部设定ion-content可滚动,但实际发现无法滚动,找了N多资料,什么scroll='false',overflow-scroll='true',添加配置js scroll,一律完全没效果,没有办法 只能自己去扒元素样式,看滚动条高度,经过一番努力,终于发现一个崩溃的事实,为了让ion-content内容不被上部固定部分覆盖,给了内容一个margin-to
使用ionic框架的<ion-scroll>进行水平滚动时,导致页面难以上下滑动的解决方案
但是我们项目中遇到一个问题:一个页面很大,有多个画廊控件,我们的页面很难上下滑动,滑动非常吃力,这是为什么呢?举个例子:如果你的页面放的全都是input输入控件,那么这个页面一样很难滑动,因为当我们在手机屏幕上滑动的时候,一不小心很容易就会点中这些输入框,当输入框获得焦点,页面就不能滑动了。使用<ion-scroll>一样有这个问题,当页面全是画廊控件的时候,滑动也十分费劲。从ionic文档中也没有找到好的解决办法,最后解决方法是:不使用<ion-scroll>指令,自己实现左右滑动。利用HTML5中的to
ionic-scroll,页面难以上下滑动的解决方案
混合app开发使用ionic框架的指令能够方便地实现水平滚动和垂直滑动。比如我们想实现一个能够水平滑动的画廊,可以使用下面这段代码。 [html] view plain copy html>     head>       meta http-equiv="Content-Type" content="text/html; charset=utf-8
禁止ionic 整体上下拖动
参考文档:https://www.jianshu.com/p/867415052a0a &amp;lt;preference name=&quot;webviewbounce&quot; value=&quot;false&quot; /&amp;gt; &amp;lt;preference name=&quot;UIWebViewBounce&quot; value=&quot;false&quot; /&amp;gt; &amp;lt;preference name=&quot;DisallowOv
【ionic+angularjs】iphone手机页面滑动出现空白页面
在开发ionic的页面时,在iphone手机上使用时,屏幕的上下滑动经常会出现白屏(页面空白)。经分析得出出现这种情况的原因: 1、在标签中设置了属性overflow-scroll="true" 2、页面中所有元素在渲染后的高度没有超出允许展示的高度(不会出现滚动条) 去掉属性overflow-scroll="true",即使用ionic原生滚动,不管页面中所有元素在渲染后的高度是否超出
Ionic 3 在 ios 平台下拖拽漏出灰白色背景
使用 Cordova 进行跨平台应用开发时,发现在 ios 平台下,如果页面处于最顶端时,用手指向下拖动,会露出空背景(灰白色)。同样页面在最底部的时候,继续向上拖动,下方也会露出空背景。 要禁止这个拖动效果,可在 config.xml 中进行如下设置: &amp;lt;preference name=&quot;webviewbounce&quot; value=&quot;false&quot; /&amp;gt; &amp;lt;preferenc...
解决移动端特别是ios滑动卡屏 滑动卡顿
css属性解决 -webkit-overflow-scrolling:touch; 插件解决 iscroll jroll2
IONIC页面底部被遮住,无法向上滚动问题解决方案
IONIC作为目前最为火热的框架,在开发过程中我们同样会遇到各种各样奇葩的问题,比如下面这个:问题描述:在页面底部有一个按钮,点击这个按钮会额外显示一些数据,此时页面会超出,需要滚动效果,同样的场景对于ion-list 的infinate效果,但是偶尔会出现,无法滚动的问题,手指向上拖动,松开后又弹回原来位置,始终看不到底部数据,这是因为ionic view没有重新计算新增高度的问题。解决方案我们需
vue项目页面在苹果手机浏览器上上下滑动出现卡顿现象解决办法
在公用的样式底部加上 -webkit-overflow-scrolling: touch;
IOS Ionic Iframe 页面会闪烁问题
Ios Iframe 页面滑动问题
IOS笔记UI--禁止scrollview上下拖动
申明:此为本人学习笔记,若有纰漏错误之处的可留言共同探讨 在最近的学习中发现,scrollView有时候可以上下左右拖动,效果很是不好。具体触发的原因可能有许多种,本篇介绍本人遇见的一种,并提供解决办法 /*  scrollVIew加在一个已经加了UINavigationController和tabBarViewController 的ViewController里. 如果scro
RecyclerView 拖动才刷新内容
RecyclerView 拖动才刷新内容遇到问题是在ViewPager中的某个RecyclerView明明在UI线程调用了它的adapter.notifydatasetchanged()方法,但是UI就是没有刷新,且用手指拖动界面之后其才会刷新。 这个问题常见于内存消耗比较大,貌似Fragment被怎么回收了?这个时候监听Viewpager的onPageSelected事件,切换完tab之后调用
ionic3 -- ion-scroll 标签不滚动问题
今天在项目用使用ionic3&amp;lt;ion-scroll&amp;gt;&amp;lt;/ion-scroll&amp;gt;标签实现照片滑屏滚动呈现的样式,但是出现了两个问题: 1.在标签中放入照片数组之后,照片不显示;代买如下: &amp;lt;ion-list &amp;gt; &amp;lt;ion-scroll scrollX=&quot;true&quot; &amp;gt; &amp;lt;ul class=&quot;pics&quot;&amp;gt;
ionic4 webApp 在微信ios下 滚动回弹卡住3s的问题探讨
问题表现:当页面滚动在最顶端时,页面下拉,系统会卡住3秒,期间无法点击;当页面滚动在最低端时,页面上拉,系统会卡住3秒,期间无法点击。 解决思路,让页面高度最低为100vh + 3px; 然后 让页面的scrollTop永远不要处在0 或者最低端 css: 给容器一个最低高度 min-height: calc(100vh + 3px); html: &lt;ion-content [sc...
ionic3 解决content的scroll滚动问题 / fixed的问题
不知道有没有小伙伴和我一样遇到这样的情况: 在四个tab下面,还需要个div固定在上面。 网页上怎么测试都没有问题,但是真机测试的时候,我的div虽然fixed在最上面,还是会随着内容的滚动而滚动。总之,问题很多。 解决方式如下: &amp;lt;ion-content scroll=&quot;false&quot;&amp;gt; &amp;lt;div class=&quot;a a a&quot;&amp;gt...
解决IOS手机页面overflow:scoll属性滑动很卡问题
加入一行-webkit-overflow-scrolling: touch;就可以滑动流畅了啊。据说是因为这行代码启用了硬件技术特性,所以滑动很流畅,但是这个属性也会相对消耗更多内容。在流畅的滑动效果和耗费多点内存之间,我选择了前者从前端开发的角度讲,只需要知道CSS的属性-webkit-overflow-scrolling是真的创建了带有硬件加速的系统级控件,所以效率很高。但是这相对是耗更多内存...
ionic:实现滑动的三种方式
在移动端受屏幕大小所限,展示内容很多的时候,就要使部分区域进行滑动。本文展示项目中所有到的几种方式,大家可以看自己的需求选择合适的滑动方式。实现滑动的基本原理,有两个容器A、B,假如A在外层,B在内层;外层的A宽度或高度固定,内层容器B宽度或者高度大于A即可实现滚动。
Ionic3取消滚动条 --记录
在全局scss文件 app.scss文件中添加 ::-webkit-scrollbar { display: none !important; }
ionic ios 键盘 布局 滚动
ionic的坑,给后来人参考。 [delegate-handle=""] [padding=""] [scroll=""] [overflow-scroll=""] [has-bouncing=""] [on-scroll=""] [on-scroll-complete=""]> ... 参考 http://www.ionic.w
iOS-纵向(竖向)滑动的VerticalSlider
GQYVerticalSlider 可以自定义背景图片和滑块的Slider,纵向(竖向)滑动 API 跟系统UISlider 类似 @property (nonatomic,strong)UIImage * minImage; @property (nonatomic,strong)UIImage * maxImage; @property (nonat...
ionic3 BUG记录(还有另外一篇针对IOS的)
记录一下在使用ionic3过程中遇到的问题(有些可能不详细)(还有另外一篇针对IOS的) http://blog.csdn.net/qq_28765817/article/details/77551069 1.使用自定义的模态框(ModalController)的时候,不要在自定义模态框内直接 push 页面 ,会导致左滑返回和ios顶部出现异常。 2.相机插件默认底部的提示文字是英文(Ge
cordova上下拖动页面出现黑色区域问题
转载的,写的太好了,忍不住转载了。 原地址是:http://my.oschina.net/jack088/blog/392523 ----问题:cordova创建的应用,上下拖动页面的时候,会有黑色的区域。起初,我以为是dojo/mobile的问题,找了半天。后来我慢慢确定是cordova的问题,网上找了下,还真找到答案了。在此记录下。 ----解决办法: 修改
纯css实现移动端横向滑动列表(可应用于ionic3移动app开发)
前几天在公司做开发的时候碰到一个列表横向滑动的功能,当时用了iscroll做,结果导致手指触到列表的范围内竖向滑动屏幕滑动不了的问题。 这个问题不知道iscroll本身能不能解决,当时选择了换一种方式来做,只要css就能搞定了,主要是利用了display:-webkit-box来实现。 &amp;amp;amp;lt;!DOCTYPE html&amp;amp;amp;g...
Ionic 中IOS手机侧边滑动时出现空白问题
问题描述: 在IOS界面中,往侧边滑动出现空白页面。 问题原因: 由于ionic在IOS手机向侧边滑动会返回上一页功能,导致问题的出现。 解决方法: 可以有以下两种方法解决: 一、在项目入口处配置$ionicConfigProvider,一般在app.js中   (推荐此方法)      $ionicConfigProvider.views.swipe
MUI 上下滑动划不了 怎么办
执行js$('#scroll').scroll({indicators: true //是否显示滚动条});初始化马上就好了如需了解mui的其他滑动bug请移步mui的BUG持续更新https://blog.csdn.net/xiaohxx/article/details/79423818...
H5页面在ios上双击div,导致屏幕上移的js解决办法
页面中的汉堡键有动画效果,在安卓手机上双击没问题,在ios上双击就导致页面上移,再点击按钮就恢复了,但这样很不友好,在网上查找资料,发现很多人都用这段代码,于是丢进去试一下,结果OK,故记录下来备用。 在js中添加以下内容就好了,亲测可用 //阻止用户双击使屏幕上滑     var agent = navigator.userAgent.toLowerCase();        //检测是否...
ionic实现部分内容滚动,以及滚动内容显示不完全的解决办法
ionic项目开发时,我们往往需要实现这么一个,上面标题等部分固定不动,下面的展示信息部分内容较多时实现滚动。 在ion-content内的部分默认是滚动的,但是我们不需要它全部内容滚动,应该怎么办呢? 1、先给ion-content加上属性scroll="false",如下图: &lt;ion-content scroll="false"&gt; ... &lt;/ion-con...
H5页面选IOS系统滑动卡动问题!
正常的H5页面在安卓 win下滑动正常,但是IOS下明显卡顿!解决方法:在主体内容的class下面加 如下:main{height:100%;overflow-y:scroll;-webkit-overflow-scrolling:touch;}解决问题...
ionic2的swipe事件的上下滑动不能触发的问题解决
原因:ionic2采用hammerjs的手势事件,但是hammerjs的swipe默认是不允许垂直方向的滑动,因此,需要手动配置,并重载配置1.编写配置文件: 下载hammerjs和类型描述文件:npm install hammerjs --save &amp;amp;&amp;amp; npm install @types/hammerjs --save-dev; 新建myHammer.config.ts文件,...
IOS中滑动页面fixed浮动的问题
此现象在安卓机没问题,苹果手机在滑动时fixed的部分会出现浮动的问题&amp;lt;div style=&quot;height: 100%; overflow: auto;&quot;&amp;gt;我是内容&amp;lt;/div&amp;gt; &amp;lt;div style=&quot;position: fixed&quot;&amp;gt;我是fixed&amp;lt;/div&amp;gt;如代码所示,内容部分给一个height:100%;overflow:auto;fixed部...
iOS xib storyBoard scrollView如何在超出屏幕的部分添加控件
使用 xib、storyBoard 搭建界面的时候,如果需要在scrollView 中添加足够多的控件,那超出屏幕的部分要怎么添加呢?一种方法是 先把 view 移到屏幕中间,搭建完成再移回去,但是感觉这样不是很好。 其实可以把控制器的 view 的 size 设置为 freeform 就可以决绝这个问题,就类似 xib 中把 view 的 frame 设置为 freeform 这样就可以添加...
ionic ios 闪屏(页面中设置的默认隐藏元素先跳出来一下)
经过测试ios端使用ng-show的时候可能会先把该块加载出来,然后再隐藏,过程中会有一点延迟,所以使用ng-show的时候经常会出现闪屏; 解决办法: 1.假如这个模块未静态数据,可以直接使用ng-if代替ng-show; 2.假如这个模块内包含动态数据(比如出现ng-model需要动态控制页面),可以使用ng-show,但需要再手动给该模块添加style=“display:none”具体
ionic页面切换卡顿解决方法
使用ionic开发app的时候,会发现切换页面的动画会卡顿,并不流畅,为了保证用户体验,大部分人会使用禁用动画的方法$ionicConfigProvider.views.transition('no');,但并不是最好的解决思路,cordova提供了native transitions可以让页面切换近乎原型的体验。主要步骤如下: 1、npm install ionic-native-transi
基于mui框架webApp开发垂直滑动导航设置问题
基于mui前端框架实现App垂直滑动导航设置问题,根据顶部导航栏高度设置垂直导航条滑动的距离顶部的高度,demo下载地址:https://github.com/mazhaoyou/myAccumulate,效果图如下: ...
移动端垂直翻页+css3动画经验总结
1、学会分析问题,用专业的眼光看问题不能浮于表面。例如,翻页 首先要弄清楚鼠标事件(touchstart/touchmove/touchend); 其次,分析事件触发过程以及在这个过程中需要得到的网页信息(start的时候要获取页面位置;move的时候要让网页整体跟着手指的移动而移动;end的时候要根据临界条件(比如100px的移动距离)实现上滑和下滑); 再次,怎样实现上一
文章热词 机器学习教程 Objective-C培训 交互设计视频教程 颜色模型 设计制作学习
相关热词 mysql关联查询两次本表 native底部 react extjs glyph 图标 ios培训出来就失业 怎么才能做产品经理