ionic的scroll的使用出现的问题

最新推荐文章于 2020-04-29 10:26:34 发布
最新推荐文章于 2020-04-29 10:26:34 发布
阅读量137 收藏
点赞数
文章标签： javascript ViewUI
原文链接：http://www.cnblogs.com/happen-/p/5593362.html
版权

今天再写ionic的时候发现了一个问题，在使用ui-view的时候引用ion-scroll指令的时候初次加载的时候能能实现拖拽滚动，只能实现滚动鼠标滚轴滚动，然后各种调试，各种比较，终于发现原来是路由的问题，在使用ion-scroll指令的时候不能使用angular的路由，要使用ion-nav-view。

转载于:https://www.cnblogs.com/happen-/p/5593362.html

weixin_30539835
关注
使用ionic框架的<ion-scroll>进行水平滚动时，导致页面难以上下滑动的解决方案
aty
03-17 2万+
但是我们项目中遇到一个问题：一个页面很大，有多个画廊控件，我们的页面很难上下滑动，滑动非常吃力，这是为什么呢？举个例子：如果你的页面放的全都是input输入控件，那么这个页面一样很难滑动，因为当我们在手机屏幕上滑动的时候，一不小心很容易就会点中这些输入框，当输入框获得焦点，页面就不能滑动了。使用<ion-scroll>一样有这个问题，当页面全是画廊控件的时候，滑动也十分费劲。从ionic文档中也没有找到好的解决办法，最后解决方法是：不使用<ion-scroll>指令，自己实现左右滑动。利用HTML5中的to
ionic中<ion-scroll>设置为左右滚动，苹果手机端触摸到此标签上时无法上下滚动内容...
weixin_30446613的博客
05-16 188
ionic中<ion-scroll>设置为左右滚动，苹果手机端触摸到此标签上时无法上下滚动内容。 如下代码： <ion-scroll direction="x" scrollbar-x="false" style="width:100%"> <ul class="brand-scrollList"> <...
ionic ion-content 内ion-scroll内无法上下滑动 ion-content 内容
pht1991的博客
09-21 7968
随着项目开发的深入，功能的逐渐完善，做到后面就开始要追求用户体验的优化了。 之前在app的首页上有一个抢购模块是通过ion-scroll来实现水平滚动。单从功能上来说是没有问题的，通过direction="x"来控制scroll只在水平方向滚动。 但是此时有一个问题，当触摸点在scroll的范围内的时候，只能水平滚动，而页面却不能被上下拉动。要想上下拉动页面就必须要把触摸点放到scroll外去
flex鼠标滚轮与页面滚轮冲突问题
smiky的专栏
12-16 289
解决办法其实很简单就是禁用嵌入swf的页面元素如的鼠标轮动事件， 看到很多人写onmousewheel属性，但是在发现根本就打不到这个事件属性了，在html参考中也看不到这个属性，手动注册事件又不会，怎么办？ jquery的插件还真是多啊，居然让我找到了一个jquery.mousewheel.js，他实现了一个鼠标滚轮事件，如$("#a").mousewheel( function(){re...
ionic的ion-scroll
weixin_34010566的博客
03-30 156
<ion-scroll ng-if=""> ng-if不好用 不知道为什么 暂时保留疑问 转载于:https://www.cnblogs.com/hhs6880/p/6644134.html
解决ionic和angular上拉加载的问题
08-29
解决Ionic和Angular上拉加载的问题可以通过使用 `<ion-infinite-scroll>` 指令和 `loadMore()` 函数来实现。在 `loadMore()` 函数中，我们可以使用 `$http` 服务来请求更多的数据，并将其添加到当前的数据列表中。...
ionic-firebase-infinite-scroll
05-08
标题 "ionic-firebase-infinite-scroll" 提供了一个关键线索，表明这个项目是关于在Ionic框架中集成Firebase数据库并实现无限滚动功能的。Ionic是一个流行的开源框架，用于构建跨平台的移动应用，它基于Angular和Web...
ionic-scroll-to-top:滚动到离子顶部的一些简单代码
05-19
在本文中，我们将深入探讨如何实现“ionic-scroll-to-top”的功能，这是一个在 Ionic 应用中常见的需求，尤其是在用户需要快速回到页面顶部时。我们将会使用 JavaScript 语言，并结合 Ionic 的服务来完成这一操作。 ...
ionic在开发ios系统微信时键盘挡住输入框的解决方法(键盘弹出问题)
09-01
在使用Ionic框架开发iOS系统下的微信应用时，经常会遇到一个问题：当用户在输入框中输入内容，软键盘弹出后会遮挡输入框，导致用户体验不佳。这个问题在描述中被称为"键盘挡住输入框"的问题。解决这个问题对于提供...
ionic3 -- ion-scroll 标签不滚动问题
liayn523的博客
09-13 2494
今天在项目用使用ionic3&lt;ion-scroll&gt;&lt;/ion-scroll&gt;标签实现照片滑屏滚动呈现的样式，但是出现了两个问题： 1.在标签中放入照片数组之后，照片不显示；代买如下： &lt;ion-list &gt; &lt;ion-scroll scrollX="true" &gt; &lt;ul class="pics"&gt;
关于ionic3中使用ion-scroll不滚动问题的解决方案
李瑞清的博客
04-29 1005
当我们按照官网上的例子使用ionic-scroll的时候会出现不滚动的情况。官网例子如下所示： <ion-scroll scrollX="true"> </ion-scroll> <ion-scroll scrollY="true"> </ion-scroll> <ion-scroll scrollX="true" scrollY="tru...
ionic 安卓机获取不到$ionicScrollDelegate.getScrollPosition().top的负值
qq_27717857的博客
12-19 682
最近做的项目有个小需求，下拉刷新的同时导航栏也要跟着变高。 用了$ionicScrollDelegate.getScrollPosition().top;实时获取position的值，position为负值时为下拉刷新. 但是在android机上获取不到负值。 解决办法为： $ionicConfigProvider.scrolling.jsScrolling(true);
ionic上拉刷新功能的demo
minuhdbsd的博客
05-15 1645
前言：本demo是一个招聘信息的展示。每次从后台查15条数据到前台展示，利用一个 一、预热知识 1、               详情参考菜鸟教程：http://www.runoob.com/ionic/ionic-scroll.html         2、ng-if   详情参考菜鸟教程：http://www.runoob.com/angularjs/ng-ng-if.
ionic4滑动加载（ion-infinite-scroll）
为什么我的眼里常含泪水？
01-10 5424
效果图如下： 并不是此代码的结果，下面代码只是我源码的部分，但应该够用了。 &lt;ion-list lines="none" inset="true" class="listfen" *ngFor="let record of pressRecordList; index as i;"&gt; &lt;ion-item&gt; &lt;s
【ionic+angularjs】$ionicScrollDelegate list列表行记录定位的两种方式
MCpang的博客
02-14 1464
为什么要定位？ 在访问带有列表的页面，一般会点击列表中某行记录，访问其详情页面，点击返回后回到列表页面，若不进行定位，那么用户需要重新滚动直到找到刚才点击的行记录，体验不好。那么返回时定位可以将刚才点击的行记录直接展示在当前的可视区域内。 ionic中列表定位可以通过$ionicScrollDelegate来实现，定位方式： 1、通过锚点定位 2、通过滚动高度定
ionic 监听页面滚动，点击停止滚动
chelen_jak的专栏
12-19 1070
原文出处：https://www.cnblogs.com/lee-xiumei/p/7449021.html 类似今日头条，页面上有很多card，点击每个card跳转该card的详情页面。这里有一个问题，当我滚动页面时，会先后触发touchstart、touchmove、touchend，但是当touchend后，页面仍会因为惯性而继续滚动。这个时候，我想点击页面停止滚动，而不是跳转到某个car...
ios使用cordova插件偶现白屏
Lemon18226601623的博客
04-23 1108
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入 欢迎使用Ma...
ionic-scroll,页面难以上下滑动的解决方案
Generon的博客
05-23 6003
混合app开发使用ionic框架的指令能够方便地实现水平滚动和垂直滑动。比如我们想实现一个能够水平滑动的画廊，可以使用下面这段代码。 [html] view plain copy html>     head>       meta http-equiv="Content-Type" content="text/html; charset=utf-8
【ionic+angularjs】iphone手机页面滑动出现空白页面
MCpang的博客
02-14 3597
在开发ionic的页面时，在iphone手机上使用时，屏幕的上下滑动经常会出现白屏（页面空白）。经分析得出出现这种情况的原因： 1、在标签中设置了属性overflow-scroll="true" 2、页面中所有元素在渲染后的高度没有超出允许展示的高度（不会出现滚动条） 去掉属性overflow-scroll="true"，即使用ionic原生滚动，不管页面中所有元素在渲染后的高度是否超出
使用Ionic构建实时混合移动应用
《Learning Ionic》这本书是关于使用Ionic框架构建实时和混合移动应用的指南，由Arvind Ravulavaru撰写。Ionic是一个流行的开源框架，它允许开发者使用HTML、CSS和JavaScript来创建跨平台的原生移动应用。这本书主要...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值