我用Bootstrap 3.3创建了一个carousel,它在我的本地机器上工作,但是当我把整个东西上传到服务器上时, Bootstrap 的js文件正在与其他文件一起编译在一个文件中,我得到了这个错误:Cannot read property 'offsetWidth' of undefined-有没有人遇到过这个问题,有没有任何已知的解决方案?
Bootstrap 3.3
carousel
Cannot read property 'offsetWidth' of undefined
ugmeyewa1#
对我来说,这是因为我没有在任何幻灯片上设置active类。
active
yhuiod9q2#
我把class='carousel-item'改成了class='item'
class='carousel-item'
class='item'
<div class="item"> <img class="img-responsive" src="..." alt="..."> </div>
smdncfj33#
在页面加载时删除'Carousal slide'类,并在图像加载时使用jquery动态添加。
lvmkulzt4#
我得到了同样的错误。因为我使用了v4的alpha类名,如carousel-control-next当我用v3更改时,问题解决了。
carousel-control-next
mw3dktmi5#
我得到了同样的错误,但在我的情况下,我写了carousel item的类名为.carousel-item,bootstrap.css引用的是. item.所以错误解决了. carousel-item重命名为item
<div class="carousel-item active"></div>
更名为:
<div class="item active"></div>
dfuffjeb6#
“更改为if(typeof $next == 'object' && $next.length)$next[0].offsetWidth”-没有帮助。如果您将Bootstrap 3转换为php(WordPress主题),当添加WP_Query($loop = new WP_Query($args);$count = 0;.和和在endwhile之前的end;add $count++;。
trnvg8h37#
如果你使用的是编译后的bootstrap,修复它的方法之一是编辑bootstrap.min.js
$next[0].offsetWidth
强制回流更改为
if (typeof $next == 'object' && $next.length) $next[0].offsetWidth // force reflow
46scxncf8#
当我创建一个动态模式弹出窗口时,我遇到了这个问题,我找到了一个解决方案,即默认情况下,幻灯片上需要一个空白的活动项目-项目设置为活动,没有任何内容。
<div class="carousel-inner" role="listbox"> <div class="item active"></div> //some slides items was addêd dynamic from database..... </div>
希望这个解决方案对你有帮助
8条答案
按热度按时间ugmeyewa1#
对我来说,这是因为我没有在任何幻灯片上设置
active
类。yhuiod9q2#
我把
class='carousel-item'
改成了class='item'
smdncfj33#
在页面加载时删除'Carousal slide'类,并在图像加载时使用jquery动态添加。
lvmkulzt4#
我得到了同样的错误。因为我使用了v4的alpha类名,如
carousel-control-next
当我用v3更改时,问题解决了。mw3dktmi5#
我得到了同样的错误,但在我的情况下,我写了carousel item的类名为.carousel-item,bootstrap.css引用的是. item.所以错误解决了. carousel-item重命名为item
更名为:
dfuffjeb6#
“更改为if(typeof $next == 'object' && $next.length)$next[0].offsetWidth”-没有帮助。如果您将Bootstrap 3转换为php(WordPress主题),当添加WP_Query($loop = new WP_Query($args);$count = 0;.和和在endwhile之前的end;add $count++;。
trnvg8h37#
如果你使用的是编译后的bootstrap,修复它的方法之一是编辑bootstrap.min.js
强制回流更改为
46scxncf8#
当我创建一个动态模式弹出窗口时,我遇到了这个问题,我找到了一个解决方案,即默认情况下,幻灯片上需要一个空白的活动项目-项目设置为活动,没有任何内容。
希望这个解决方案对你有帮助