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 ...
随机推荐
- AX_Args
Args args; FormRun formRun; ; args = new Args(); args.name(formstr(FormName)); args.caller(); args.r ...
- 【机器学习】用Octave实现一元线性回归的梯度下降算法
Step1 Plotting the Data 在处理数据之前,我们通常要了解数据,对于这次的数据集合,我们可以通过离散的点来描绘它,在一个2D的平面里把它画出来. 6.1101,17.592 5.5 ...
- 2016年3月31日_应化所群体Review
Review目的: Phonegap的ble插件可以接收到设备发送的信息,但接收并在控制台显示的数据夏一鸣不知道是正确的数据,还是由于编码解码问题导致的乱码问题.此次Review要解决的问题即判断接收 ...
- 2017-2018-1 20155312《信息安全技术》实验二——Windows口令破解实验报告
2017-2018-1 20155312<信息安全技术>实验二--Windows口令破解实验报告 实验目的 了解Windows口令破解原理 对信息安全有直观感性认识 能够运用工具实现口令破 ...
- HDU3695(AC自动机模板题)
题意:给你n个字符串,再给你一个大的字符串A,问你着n个字符串在正的A和反的A里出现多少个? 其实就是AC自动机模板题啊( ╯□╰ ) 正着query一次再反着query一次就好了 /* gyt Li ...
- Java 数组拷贝方法 System.arraycopy
System类提供的数组拷贝方法: public static native void arraycopy(Object src, int srcPos, Object dest, int destP ...
- 1-9-假期训练心得(dp+bfs)
题目一:传送门 思路:就是简单的bfs,注意仔细审题,加上对转弯次数的判断. 题目二:传送门 思路:简单dp,记录每一秒每个位置接到的大饼的数量. 状态转移方程:dp[i][j]=max(dp[i][ ...
- pat1079+1086+1090+1094(树的遍历)感想
今天做了这4道题,虽然大部分以前做过,但还是有些知识掌握不全. 总结一下所用的树的知识及解决方法 (1)非二叉树的遍历: 非二叉树就是图,所以它的存储结构类似邻接表,c++提供了vector数组可以很 ...
- 解决maltab的中文和英文字体问题,中文乱码
用比较好看的编程字体,偏偏不显示中文,用支持中文的字体,英文不是等宽的,非常难看. 最近在网上找这方面的解决方法,发现解决问题的方法还是有的. 其实这个问题的原因就是系统自带的等宽字体,不支持中文,解 ...
- Mybatis-Plus 实战完整学习笔记(一)------简介
第一章 简介 1. 什么是MybatisPlus MyBatis-Plus(简称 MP)是一个 MyBatis 的增强工具,在 MyBatis 的基础上只 ...