gpt4 book ai didi

javascript - 在整个页面上工作的水平滚动 jquery

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

我在一个网站上工作。我需要在特定部分水平滚动,因为我正在使用 JinvertScroll jquery。当我运行那个 jquery 的示例时,滚动在整个页面上工作。我如何为特定部分设置滚动只有??我的意思是我如何设置应该滚动的特定 div?这是代码。

     <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="css/example.css" />
</head>
<body>


<section id="scrolll">
<div class="middle scroll" style="border:solid red;backgroun:red">
<img src="images/middle.png" alt="" />
</div>



<script type="text/javascript" src="../libs/jquery.min.js"></script>
<script type="text/javascript" src="../src/jquery.jInvertScroll.js"></script>
<script type="text/javascript">
(function($) {
var scrolll= document.getElementById('scrolll');
var elem = $.jInvertScroll(['.scroll'], // an array containing the selector(s) for the elements you want to animate
{
height: 600, // optional: define the height the user can scroll, otherwise the overall length will be taken as scrollable height
onScroll: function(percent) { //optional: callback function that will be called when the user scrolls down, useful for animating other things on the page
console.log(percent-50);
}
});

$(window).resize(function() {
if ($(window).width() <= 768) {
elem.destroy();
}
else {
elem.reinitialize();
}
});
}(jQuery));
</script>
</section>

<section>
<div style="border:solid orange;height:1000px"></div>
</section>

</body>
</html>

最佳答案

<div id="scrollDiv" style="overflow:auto;">
// write code here over which scroll will be applied
</div>

您要滚动的部分将其放在 div 中。给那个 div 一个 Id 例如scrollDiv 并在其上放置一个样式属性,如上例所示。

关于javascript - 在整个页面上工作的水平滚动 jquery,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40859838/

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