因为图片是动态创建的,在插件开始初始化时,文档流中没用图片,故没有创建相应宽度。通过调整js加载顺序,问题还是没有解决。

最后找到swiper插件 api 有属性是可以根据内容变动,自动初始化插件的,添加observer:true后问题解决!

 

var mySwiper = new Swiper ('.swiper-container', {
      direction: 'horizontal',
      loop: false,
      observer:true,//修改swiper自己或子元素时,自动初始化swiper

})

原文作者链接地址:https://www.cnblogs.com/demoworld/p/5977799.html

使用swiper 轮播插件ajax 请求加载图片时,无法滑动问题的更多相关文章

  1. Swiper 轮播插件 之 动态加载无法滑动

    1.原因:轮播图未完全动态加载完成,即初始化 2.方法一:ajax链式编程 $.ajax({ type: "get", url: serviceURL + "/listB ...

  2. 使用Swiper轮播插件引起的探索

    提到Swiper轮播插件,小伙伴们应该不会感到陌生.以前我主要在移动端上使用,PC端使用较少. 注:这里需要注意的是,在PC端和移动端使用Swiper是不同的 官方给的版本有三个,分别是Swiper2 ...

  3. iOS最笨的办法实现无限轮播图(网络加载)

    iOS最笨的办法实现无限轮播图(网络加载) 简单的做了一下: 使用方法: 把 请求返回的 图片地址(字符串类型)放进数组中就行 可以使用SDWebImage(我就是用的这个)等..需要自己导入并引用, ...

  4. Android Glide加载图片时转换为圆形、圆角、毛玻璃等图片效果

     Android Glide加载图片时转换为圆形.圆角.毛玻璃等图片效果 附录1简单介绍了Android开源的图片加载框架.在实际的开发中,虽然Glide解决了快速加载图片的问题,但还有一个问题悬 ...

  5. 使用ajax预加载图片

    使用Ajax 上面所给出的方法似乎不够酷,那现在来看一个使用Ajax实现图片预加载的方法.该方法利用DOM,不仅仅预加载图片,还会预加载CSS.JavaScript等相关的东西.使用Ajax,比直接使 ...

  6. Android的ListView异步加载图片时,错位、重复、闪烁问题的分析及解决方法

    Android ListView异步加载图片错位.重复.闪烁分析以及解决方案,具体问题分析以及解决方案请看下文. 我们在使用ListView异步加载图片的时候,在快速滑动或者网络不好的情况下,会出现图 ...

  7. 微信小程序 加载图片时,先拉长,再恢复正常

    今天在写小程序,发现小程序的图片image如过mode设置为widthFix的话, 加载图片会被先拉伸,后恢复正常 我的处理方法是,给他一个初始的height值,或者就直接 height:auto

  8. vue中引用swiper轮播插件

    有时候我们需要在vue中使用轮播组件,如果是在vue组件中引入第三方组件的话,最好通过npm安装,从而进行统一安装包管理. 申明:本文所使用的是vue.2x版本. 通过npm安装插件: npm ins ...

  9. Swiper轮播插件使用

    前文 Swiper是纯javascript打造的滑动特效插件,面向手机.平板电脑等移动终端,能实现触屏焦点图.触屏Tab切换.触屏多图切换等常用效果.                 归根到此,Swi ...

随机推荐

  1. python http post json

    直接上代码吧 #coding=utf-8 import os import urllib import urllib2 import re import cookielib import json h ...

  2. SharedFile System Master Slave(共享文件系统)做ActiveMQ集群

    WINDOWS环境下:http://www.apache.org/dyn/closer.cgi?path=/activemq/apache-activemq/5.9.0/apache-activemq ...

  3. 查询改写(Query Rewrite)方法总结

    为何需要Query改写 Query分析是搜索引擎的一个重要模块,对搜索结果的覆盖率和相关性至关重要.搜索引擎的检索过程包含了两个重要的阶段:匹配和排序.匹配也叫召回,表示根据用户的查询条件,尽可能多地 ...

  4. 前端html页面学习---html部分

    作为一个后台开发人员:本篇博客主要是关注前后台交互时需要掌握的html技术,不涉及css这一块的内容:主要是自学过程中的备忘 1:html常用标签标签的学习:不列出结束标签 <p>:段落: ...

  5. vue学前班004(基础指令与使用技巧)

    我学vue 的最终目的是为了 做apicloud 和vue 的开发  作为配合apicloud的前端框架使用 所以项目用不到的会暂时不介绍. (强烈建议  官网案例走一遍) 基础指令的学习(结合aui ...

  6. Weblogic有免费的License了

    分类: 系统运维 曾几何时, 为了找一个不限IP, 不限CPU, 不限时间的Weblogic License, 需要翻遍整个互联网, 这种日子一去不复返了~~~~~ 几个月前, 听到Oracle收购B ...

  7. POJ 1062

    #include<iostream> #include<stdio.h> #define MAXN 105 #define inf 10000000 using namespa ...

  8. Android自定义View创建流程

    Android的framework提供了很多高质量的view,有时业务需求需要自定义View,其实现流程大致如下: 1.在values/attrs.xml中定义支持的自定义属性,示例如下:

  9. 利用BitviseSSH免root实现Windows vs Linux的文件互传

    虚拟机截图,,,质量有点差,大家看看! ------------------- 在拿不到Linux root账户的情况下,winscp等工具是无法实现文件传输的,此时我们可以借用Bitvise SSH ...

  10. 开源微信支付SDK

    应该有一年多没在博客园上写文章了,毕竟是一个记录自己技术成长的平台,没能将写博客长期坚持下来,说起来也是挺惭愧的.对于自己的近况而言,确实平常加班也比较多,时间会比较压缩,所以到后来博客也基本停止了更 ...