资讯专栏INFORMATION COLUMN

ionic之点击放大图片

AaronYuan / 878人阅读

摘要:开发过程中常常会遇到点击展示大图片的需求,只需要,弹出框就可以轻松实现。样式也可以运用增加左滑右滑切换图片的效果

开发过程中常常会遇到点击展示大图片的需求,只需要ng-if,popover-backdrop(弹出框) 就可以轻松实现。
html:


  
    

css样式:

.shade {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
  width: 100%;
  height: 100%;
}

.bigImage {
  position: absolute;
  top: 20%;
  left: 50%;
  z-index: 10;
  display: block;
  transform: translateX(-50%);
  max-height: 100%;
  max-width: 100%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.6);
}

也可以运用on-swipe增加左滑右滑切换图片的效果

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/84530.html

相关文章

  • ionic1使用ImagePicker插件并且显示中文(汉化)

    摘要:在使用开发时,打开相册应该是使用比较频繁的插件之一。解决办法可以看我另一篇文章使用在安卓手机上闪退问题参考文献之图片选择插件使用插件中文显示 在使用ionic开发时,打开相册应该是使用比较频繁的插件之一。下面讲讲我在项目中使用(这部分官方比较详细,就简单描述)以及解决插件显示英文问题 1、imagepicker安装cordova plugin add cordova-plugin-im...

    Vultr 评论0 收藏0
  • ionic1使用ImagePicker插件并且显示中文(汉化)

    摘要:在使用开发时,打开相册应该是使用比较频繁的插件之一。解决办法可以看我另一篇文章使用在安卓手机上闪退问题参考文献之图片选择插件使用插件中文显示 在使用ionic开发时,打开相册应该是使用比较频繁的插件之一。下面讲讲我在项目中使用(这部分官方比较详细,就简单描述)以及解决插件显示英文问题 1、imagepicker安装cordova plugin add cordova-plugin-im...

    liuyix 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<