标签: scrollbar

如何检测浏览器的哪一侧是滚动条 - 向右还是向左(如果是RTL)?

对于<html dir="rtl">某些浏览器(Safari,Edge,IE)会自动将滚动条移动到左侧,这是正确的行为:

在此输入图像描述

不幸的是,主流浏览器(Chrome和Firefox)的行为方式不同,滚动条仍位于浏览器的右侧.

是否有可能以编程方式检测(最好使用vanilla JS)哪一侧是滚动条?


UPD(28.09.2018):到目前为止,答案中没有可行的解决方案,人们试图通过使用getBoundingClientRect().left或者检测滚动条位置.offsetLeft,这将无法工作,因为它始终0至少在Edge中独立于滚动条位置.


UPD(15.10.2018):TLDR:没办法.

似乎浏览器不提供用于检测滚动条侧的API.在下面的答案中,有插入假人的技巧div并计算该div中的滚动条的位置.我不能将这些技巧视为答案,因为文档滚动条可以通过多种方式定位(<html dir="rtl">RTL版本的操作系统,浏览器设置等)

javascript scrollbar arabic hebrew right-to-left

26
推荐指数
1
解决办法
1048
查看次数

如果文本不适合,如何在System.Windows.Forms.TextBox上显示滚动条?

对于Multiline = True的System.Windows.Forms.TextBox,我只想在文本不适合时显示滚动条.

这是仅用于显示的只读文本框.它是一个TextBox,以便用户可以复制文本.是否有任何内置支持滚动条的自动显示?如果没有,我应该使用不同的控件吗?或者我是否需要挂钩TextChanged并手动检查溢出(如果是,如何判断文本是否适合?)


没有任何运气与WordWrap和Scrollbars设置的各种组合.我想最初没有滚动条,只有当文本不适合给定的方向时才会动态显示.


@nobugz,谢谢,当WordWrap被禁用时有效.我不想禁用wordwrap,但它是两个邪恶中较小的一个.


@AndréNeves,好的一点,如果是用户可编辑的话,我会这样做.我同意一致性是UI直观性的基本规则.

textbox scrollbar winforms

25
推荐指数
4
解决办法
2万
查看次数

如何区分手动滚动(通过鼠标滚轮/滚动条)与Javascript/jQuery滚动?

更新:

这是一个证明问题的jsbin示例.

更新2:
这是固定版本归功于fudgey.


基本上,我有以下javascript将窗口滚动到页面上的锚点:

 // get anchors with href's that start with "#"
 $("a[href^=#]").live("click", function(){
     var target = $($(this).attr("href"));
     // if the target exists: scroll to it...
     if(target[0]){
         // If the page isn't long enough to scroll to the target's position
         // we want to scroll as much as we can. This part prevents a sudden 
         // stop when window.scrollTop reaches its maximum.
         var y = Math.min(target.offset().top, $(document).height() - $(window).height());
         // also, don't …
Run Code Online (Sandbox Code Playgroud)

javascript jquery scroll scrollbar mousewheel

25
推荐指数
1
解决办法
1万
查看次数

表格布局面板滚动条

给定一个包含2列和多行的表布局面板,如何将滚动条附加到它上面,因为它有时会比表单的大小增长得多.

谢谢

c# user-interface scrollbar tablelayoutpanel

25
推荐指数
2
解决办法
4万
查看次数

如何使CSS表适合屏幕宽度?

目前该表太宽,导致浏览器添加水平滚动条.

html css scrollbar css-tables

24
推荐指数
3
解决办法
8万
查看次数

停用或删除HTML上的滚动条

我想scrollbar在HTML页面中取消激活或删除垂直.
怎么做 ?

谢谢.

html css scrollbar

23
推荐指数
2
解决办法
11万
查看次数

Firefox中的滚动条颜色更改

我想在Firefox中更改滚动条颜色.我怎样才能做到这一点?

css firefox scroll scrollbar

23
推荐指数
3
解决办法
6万
查看次数

如果高度设置为auto,WPF ListView没有滚动条

嗨,我有一个绑定到集合的ListView.我将ListView的高度设置为auto,以便占用该区域中的所有空间.但是,在将高度设置为auto后,没有滚动条.如果我给它一个高度,那么滚动条就会显示出来.

标记非常类似于以下内容

<Grid>
   <StackPanel>
      <Expander>
          <DataGrid>
      <Expander>
          <ListView>
Run Code Online (Sandbox Code Playgroud)

wpf layout listview scrollbar

23
推荐指数
2
解决办法
3万
查看次数

使用转换:: - webkit-scrollbar?

是否可以在webkit滚动条上使用转换?我试过了:

div#main::-webkit-scrollbar-thumb {
    background: rgba(255,204,102,0.25);
    -webkit-transition: background 1s;
    transition: background 1s;
}

div#main:hover::-webkit-scrollbar-thumb {
    background: rgba(255,204,102,1);
}
Run Code Online (Sandbox Code Playgroud)

但它不起作用.或者是否可以创建类似的效果(没有JavaScript)?

这是一个显示rgba过渡问题的jsfiddle

css webkit scrollbar css-transitions

23
推荐指数
5
解决办法
1万
查看次数

正文设置为溢出-y:隐藏但页面仍可在Chrome中滚动

overflow-y在Chrome中遇到了该属性的问题.即使我已将其设置为hidden,我仍然可以使用鼠标滚轮滚动页面.

这是我的代码:

html,
body {
  overflow-y: hidden;
}

#content {
  position: absolute;
  width: 100%;
}

.step {
  position: relative;
  height: 500px;
  margin-bottom: 500px;
}
Run Code Online (Sandbox Code Playgroud)
<body>
  <div id="content">
    <div class="step">this is the 1st step</div>
    <div class="step">this is the 2nd step</div>
    <div class="step">this is the 3rd step</div>
  </div>
</body>
Run Code Online (Sandbox Code Playgroud)

有人知道如何阻止Chrome中的垂直滚动吗?

谢谢!

css scroll google-chrome overflow scrollbar

23
推荐指数
3
解决办法
9万
查看次数