gpt4 book ai didi

javascript - 在使用 skrollr.js 和 ID 为 "skrollr-body"的多个 div 时,Scroll 在 android 中不起作用

转载 作者:行者123 更新时间:2023-11-28 11:03:59 25 4
gpt4 key购买 nike

我正在使用 skrollr.js 制作动画,但由于某种原因滚动无法正常工作。在桌面上一切正常。正如文档中所建议的那样,我将所有内容都包装在一个 ID 为“skrollr-body”的 div 中,但是当我在浏览器控制台中检查呈现的 html 时,我可以看到两个具有相同 ID“skrollr-body”的 div。第一个是空的 div,另一个 div 是我添加的包装 div。请帮忙。

这是呈现的 HTML

<body>
<div id="skrollr-body"></div>
<div class="container" id="content_div">
<div class="row feature-row">
<div class="col-sm-6 col-md-6">
<div id="screens_div">
<img class="img-responsive skrollable skrollable-before" data-anchor-target="#screens_div" data-center-top="transform: rotate(0deg);" data-center-bottom="transform: rotate(90deg);" id="lumia" src="images/lumia.png" style="-webkit-transform: rotate(0deg);">
</div>
</div>
<div class="col-sm-6 col-md-6" id="innovative">
<h2 style="color:#FF4B25;">INNOVATIVE AD FORMATS</h2>
<p class="description_paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus ut justo tortor. Nulla faucibus aliquet nisi sit amet iaculis. Fusce libero mauris, mollis nec nulla eget, imperdiet blandit lacus. Ut posuere, dolor ac lobortis suscipit, tellus nulla cursus massa, a vulputate sem erat sit amet orci. Nam ut suscipit purus. Ut ut vehicula risus. Vestibulum ac quam sagittis, feugiat velit at, laoreet metus. Aliquam suscipit vulputate risus, eget commodo orci tempor ac. Suspendisse suscipit bibendum risus quis condimentum.</p>
</div>
</div>
</div>
<script src="javascripts/skrollr.js" type="text/javascript"></script>
<script type="text/javascript">
var s = skrollr.init({
forceHeight : false
});
</script>
</body>

谢谢,查兰。

最佳答案

尝试当你“我把所有东西都包装在一个 id 为“skrollr-body”的 div 中但是”撤消那个..

现在在

$(document).ready(function() {
$('#skrollr-body').remove(); //removes the empty div..
$('#content_div').wrap('<div id="skrollr-body">');
});

已更新 - $('#skrollr-body').remove();将删除此 <div id="skrollr-body"></div>

然后 $('#content_div').wrap('<div id="skrollr-body">');将包裹 <div class="container" id="content_div">在所需的 div 中添加一个新的 <div id="skrollr-body">

您的新 HTML 将如下所示:

<body>
<div id="skrollr-body">
<div class="container" id="content_div">
<div class="row feature-row">
<div class="col-sm-6 col-md-6">
<div id="screens_div">
<img class="img-responsive skrollable skrollable-before" data-anchor-target="#screens_div" data-center-top="transform: rotate(0deg);" data-center-bottom="transform: rotate(90deg);" id="lumia" src="images/lumia.png" style="-webkit-transform: rotate(0deg);">
</div>
</div>
<div class="col-sm-6 col-md-6" id="innovative">
<h2 style="color:#FF4B25;">INNOVATIVE AD FORMATS</h2>
<p class="description_paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus ut justo tortor. Nulla faucibus aliquet nisi sit amet iaculis. Fusce libero mauris, mollis nec nulla eget, imperdiet blandit lacus. Ut posuere, dolor ac lobortis suscipit, tellus nulla cursus massa, a vulputate sem erat sit amet orci. Nam ut suscipit purus. Ut ut vehicula risus. Vestibulum ac quam sagittis, feugiat velit at, laoreet metus. Aliquam suscipit vulputate risus, eget commodo orci tempor ac. Suspendisse suscipit bibendum risus quis condimentum.</p>
</div>
</div>
</div>
</div>
</body>

关于javascript - 在使用 skrollr.js 和 ID 为 "skrollr-body"的多个 div 时,Scroll 在 android 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22327231/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com