Skrollr.js插件不在Parallaxing内部Bootstrap Carousel – 提供小提琴
我对Parallax和平滑滚动的SKrollr.js插件有问题。 一切正常,除了Bootstrap旋转木马,并且我确定任何旋转木马。 它显然是一个显示:当插件在加载时设置自己并且无法看到任何.item类时没有问题。 但我无法弄清楚如何让Skrollr在渲染时看到所有幻灯片/ .item类。
我甚至试过这种东西。 我的Skrollr标记不是代码总是适用于我的问题。
Skrollr Markup
data-10p-top-bottom="background-position-y: 100%;" data-bottom-top="background-position-y: 0%;"
CSS
.displaying { display: block !important; }
JS
var sk = skrollr.init({ forceHeight: false, beforerender: function(data) { $(".item").addClass('displaying'); }, render: function(data) { $(".item").removeClass('displaying'); } });
编辑
我在这里为它制作了一个JSFiddle,或者你可以在这里看到全屏调试
对不起,我是模糊和一般的,因为我知道我的HTML是坚实的。 检查小提琴。 滑块function很好,它的Skrollr无法在运行时看到隐藏的幻灯片,这是问题所在。 我只需要一个更好的解决方案来解决这个问题
我猜你需要刷新,因为我注意到它可以调整浏览器的大小。
试试这段代码:
setTimeout(function () { skrollr.get().refresh(); }, 0);
如有必要,您可以将超时更改为1000,以确保一切都加载。