用js替换owlcarousel播放的内容,会没有插件效果,请问怎么解决

JavaScript013

用js替换owlcarousel播放的内容,会没有插件效果,请问怎么解决,第1张

默认使用Bootstrap的Carousel组件,只需要加上 data-ride="carousel" 就可以实现自动播放了。无需使用初始化的js函数。

所以,如果carousel不会自动播放,那么首先检查这个部分。

这里还能加其他参数,比如是设置图片轮转的时间间隔。

你把

window.onload=a

window.onload=showTime

替换为:

window.onload=function(){

a()

showTime()

}

我都是用的layui,直接可以一个元素绑定实例化网页链接,这里可以看实例

引入layui.js后就可以用了

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>carousel模块快速使用</title>

<link rel="stylesheet" href="/static/build/layui.css" media="all">

</head>

<body>

<div class="layui-carousel" id="test1">

<div carousel-item>

<div>条目1</div>

<div>条目2</div>

<div>条目3</div>

<div>条目4</div>

<div>条目5</div>

</div>

</div>

<!-- 条目中可以是任意内容,如:<img src="">-->

<script src="/static/build/layui.js"></script>

<script>

layui.use('carousel', function(){

var carousel = layui.carousel

//建造实例

carousel.render({

elem: '#test1'

,width: '100%' //设置容器宽度

,arrow: 'always' //始终显示箭头

//,anim: 'updown' //切换动画方式

})

})

</script>

</body>

</html>