gpt4 book ai didi

javascript - 窗口调整大小时的 jQuery 滚动条不起作用

转载 作者:行者123 更新时间:2023-12-01 01:21:19 26 4
gpt4 key购买 nike

我正在使用jquery scrollbar plugin对于我的网站。一切都运转良好。但是当我在 mozilla 中调整窗口大小并制作滚动 div 并再次调整大小时,它的滚动条看起来不均匀。

如果浏览器也调整大小,如何使自定义滚动条可见。

我尝试过的脚本:

$('.scroll-lmenu').scrollbar({
autoUpdate :true,
autoScrollSize: true
});

image

$(document).ready(function(){
$('.scrollbar-inner').scrollbar();
});
.scrollbar-inner {
max-height: 300px;
overflow: auto;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://gromo.github.io/jquery.scrollbar/jquery.scrollbar.js"></script>
<link href="https://gromo.github.io/jquery.scrollbar/jquery.scrollbar.css" rel="stylesheet"/>

<div class="scrollbar-inner">
<p class="permanent">
Simple inner scrollbar over content
</p>
<p class="permanent">
<a href="#anchor">Click to test #anchors</a><br><br>
<input type="text" value="Use TAB to focus next input" style="max-width:220px; width: 100%;">
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Proin nibh augue, suscipit a,
scelerisque sed, lacinia in, mi. Cras vel lorem. Etiam pellentesque aliquet tellus.
Phasellus pharetra nulla ac diam. Quisque semper justo at risus. Donec venenatis, turpis vel
hendrerit interdum, dui ligula ultricies purus, sed posuere libero dui id orci. Nam congue,
pede vitae dapibus aliquet, elit magna vulputate arcu, vel tempus metus leo non est. Etiam
sit amet lectus quis est congue mollis. Phasellus congue lacus eget neque. Phasellus ornare,
ante vitae consectetuer consequat, purus sapien ultricies dolor, et mollis pede metus eget
nisi. Praesent sodales velit quis augue. Cras suscipit, urna at aliquam rhoncus, urna quam
viverra nisi, in interdum massa nibh nec erat.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Proin nibh augue, suscipit a,
scelerisque sed, lacinia in, mi. Cras vel lorem. Etiam pellentesque aliquet tellus.
Phasellus pharetra nulla ac diam. Quisque semper justo at risus. Donec venenatis, turpis vel
hendrerit interdum, dui ligula ultricies purus, sed posuere libero dui id orci. Nam congue,
pede vitae dapibus aliquet, elit magna vulputate arcu, vel tempus metus leo non est. Etiam
sit amet lectus quis est congue mollis. Phasellus congue lacus eget neque. Phasellus ornare,
ante vitae consectetuer consequat, purus sapien ultricies dolor, et mollis pede metus eget
nisi. Praesent sodales velit quis augue. Cras suscipit, urna at aliquam rhoncus, urna quam
viverra nisi, in interdum massa nibh nec erat.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Proin nibh augue, suscipit a,
scelerisque sed, lacinia in, mi. Cras vel lorem. Etiam pellentesque aliquet tellus.
Phasellus pharetra nulla ac diam. Quisque semper justo at risus. Donec venenatis, turpis vel
hendrerit interdum, dui ligula ultricies purus, sed posuere libero dui id orci. Nam congue,
pede vitae dapibus aliquet, elit magna vulputate arcu, vel tempus metus leo non est. Etiam
sit amet lectus quis est congue mollis. Phasellus congue lacus eget neque. Phasellus ornare,
ante vitae consectetuer consequat, purus sapien ultricies dolor, et mollis pede metus eget
nisi. Praesent sodales velit quis augue. Cras suscipit, urna at aliquam rhoncus, urna quam
viverra nisi, in interdum massa nibh nec erat.
</p>
<input type="text"><br>
<h3 id="anchor">Anchor</h3>
</div>

最佳答案

Mozilla 确实有一些用于操作滚动条的扩展,但建议不要使用它们。

-moz-scrollbars-none 他们建议使用溢出:隐藏来代替它。

-moz-scrollbars-horizo​​ntal 与overflow-x类似

-moz-scrollbars-vertical 与overflow-y类似

-moz-hidden-unscrollable 仅在用户配置文件设置内部起作用。禁用滚动 XML 根元素并禁用使用箭头键和鼠标滚轮滚动网页。

Mozilla Developer Docs on 'Overflow '有关 Mozilla 的更多详细信息

据我所知,这并不是很有用,但值得注意的是,控制 Firefox 中是否显示滚动条的属性是:( reference link )

属性:滚动条

类型:nsIDOMBarProp

描述:控制窗口中是否显示滚动条的对象。该属性在 JavaScript 中是“可替换的”。只读

最后但并非最不重要的一点是,填充就像魔法。

正如之前在其他一些答案中提到的,这里有一个足够不言自明的插图

enter image description here

关于javascript - 窗口调整大小时的 jQuery 滚动条不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59045888/

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