ionic 图片轮播ion-slide-box问题
1、使用ion-slide可以实现图片轮播,但是如果在html中仅仅增加ion-slide是远远不够的,会出现两个问题:
(注:使用的是angularjs。首先需要在,js文件中注入:$ionicSlideBoxDelegate)
一、有时候会出现图片无法加载出来。解决办法是:
在相应的controller文件增加 $ionicSlideBoxDelegate.update();
二、轮播至最后一个不轮播的问题,解决的办法是:
在相应的controller文件增加 $ionicSlideBoxDelegate.loop(true);
<ion-slide-box does-continue="true" show-pager="false">
<ion-slide ng-repeat="item in slideBoxImgs">
<div class="slider-slide-image">
<img src="{{item.path}}"/></div>
</ion-slide>
</ion-slide-box>
controller中注入服务$ionicSlideBoxDelegate
.controller('HotelDetailCtrl', function ($scope,$stateParams,$http,$ionicSlideBoxDelegate)
$ionicSlideBoxDelegate.loop(true); //解决轮播至最后一个不轮播的问题
$ionicSlideBoxDelegate.update(); //解决图片加载不出来的问题
ionic 图片轮播ion-slide-box问题的更多相关文章
- 一、ionic 图片轮播问题
使用ion-slide可以实现图片轮播,但是如果在html中仅仅增加ion-slide是远远不够的,会出现两个问题:图片加载不出来和图片轮播至最后一个不轮播的问题 1.如何解决图片加载不出来的问题 i ...
- ionic 图片轮播问题
1.使用ion-slide可以实现图片轮播,但是如果在html中仅仅增加ion-slide是远远不够的,会出现两个问题: (注:使用的是angularjs.首先需要在,js文件中注入:$ionicSl ...
- 基于ionic框架封装一个图片轮播指令的几点
在这里我想在项目中封装一个图片轮播的指令 (本项目使用的是ionic框架) 1)定义指令 define(['app'],function(myapp){ myapp.directive('myslid ...
- H5如何做手机app(移动Web App)?图片轮播?ionic、MUI
移动Web App 跨平台开发 用户不需要去卖场来下载安装App 任何时候都可以发布App只需要一个开发项目 可以使用HTML5,CSS3以及JavaScript以及服务器端语言来完成(PHP,Rub ...
- 原生js+css3实现图片自动切换,图片轮播
运用CSS3transition及opacity属性 制作图片轮播动画 自己这两天根据用js来控制触发CSS3中transition属性,从而写出来的以CSS3动画为基础,js控制过程的图片轮播 运用 ...
- Unslider Web前端框架之图片轮播
前端框架,前端组件,前端库,都是一个意思,能看源码. 最近做H5小游戏,用到了图片轮播的组件,而且要求支持移动端触屏滑动.一开始用的是nivo slider,但是对大小不一样的图不支持box 的参数设 ...
- jquery 图片轮播demo实现
转载注明出处!!! 转载注明出处!!! 转载注明出处!!! 图片轮播demo,弄清楚过程其实是一个很简单的东西,看网上都没有什么实质性的代码,就自己把过程捋了一遍实现了. 这次因为随手写的,所以没有做 ...
- 图片轮播(bootstrap)与 圆角搜索框(纯css)
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...
- 利用bootstrap写图片轮播
利用bootstrap写图片轮播 缺点是轮播没有固定样式图片样式会改变外框的大小,所以要再设置 以及左右按钮的style也要从新设置 <div class="carousel slid ...
随机推荐
- Python内置的subprocess.Popen对象
具体内容参见:https://docs.python.org/3/library/subprocess.html 大概来说,就是可以对应输入的命令产生一个进程,该进程实例内置如下方法. | comm ...
- SpringMVC 学习 九 SSM环境搭建 (二) Spring配置文件的编写
spring配置文件中需要干的事情 (一)开启 Service与pojo包的注解扫描 注意:spring 扫描与表对应的实体类,以及service层的类,不能用来扫描Controller层的类,因为 ...
- swift -基础语法
/** * 1.变量 */ let count1 = 11; print(count1); var count ...
- 2019.01.20 bzoj5158 Alice&Bob(拓扑排序+贪心)
传送门 短代码简单题. 题意简述:对于一个序列XXX,定义其两个伴随序列a,ba,ba,b,aia_iai表示以第iii个数结尾的最长上升子序列长度,bib_ibi表示以第iii个数开头的最长下降 ...
- 2019.01.10 bzoj1095: [ZJOI2007]Hide 捉迷藏(动态点分治)
传送门 蒟蒻真正意义上做的第一道动态点分治! 题意:给一棵最开始所有点都是黑点的树,支持把点的颜色变成从黑/白色变成白/黑色,问当前状态树上两个最远黑点的距离. 思路: 首先考虑不带修改一次点分治怎么 ...
- oracle创建视图(view)
视图:是基于一个表或多个表或视图的逻辑表,本身不包含数据,通过它可以对表里面的数据进行查询和修改.视图基于的表称为基表,Oracle的数据库对象分为五种:表,视图,序列,索引和同义词. 视图是存储在数 ...
- jq 某个时间段的倒计时
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- EXCEL中R1C1样式引用
主要引用http://club.excelhome.net/thread-759847-1-1.html Sub chengji() ' ' 宏1 宏 ' Dim Finalrow As Intege ...
- python,函数
numpy.tile():参考https://www.jianshu.com/p/4b74a367833c numpy.argsort:argsort()里面传入参数只有数组时,返回的是数组值从小到大 ...
- MongoDB-增删改
MongoDB的shell使用了Js引擎,因此能运行任意的Js程序. MongoDB中常用基本数据类型: null:空值或者不存在的字段Boolean:true,false数值型:{"x&q ...