基于范围滑块悬停设置元素的样式

文章/答案/技术大牛

发布

2回答

html、css、hover、range

我正在尝试创建一个范围滑块拇指的悬停效果，以及一些始终定位在它上面的文本。我有以下代码，我不确定我应该使用哪组CSS选择器来创建正确的悬停。我尝试过+ ~，但似乎两者都不起作用，甚至在更改DOM中元素的顺序时也是如此。有问题的代码是： #range::-webkit-slider-thumb:hover + .range-value span {} 文本的颜色应变为绿色

浏览 17提问于2020-09-18得票数 4

回答已采纳

2回答

具有可变最大值的范围滑块

javascript

我有一个范围的滑块，可以设置为可变的最大值。40、60、80、200等等。我使用Javascript将滑块元素的背景设置为基于滑块值的特定颜色。linear-gradient(to right, #2B73CC ' + sliderValue + '%, #fff 0%)'} 仅当最

浏览 20提问于2020-10-08得票数 0

回答已采纳

1回答

如何改变jQueryUI滑块的外观？

javascript、html、jquery-ui

我需要一个拖曳滑块为我的网页。Www.jqueryui.com/ jQuery /中提供的滑块如下所示：让我们一致认为它看起来很丑。有没有办法重新设计这个灰色的，单调的滑块与我令人敬畏的图像？提前谢谢。

浏览 4提问于2013-12-08得票数 0

回答已采纳

1回答

火狐html5范围滑块中拇指和轨迹的不同z索引

javascript、css、html、firefox、input

对于HTML5中的"range“输入元素，有一种很好的方法可以将拇指和音轨分开。唯一的问题是它在不同的浏览器上的工作方式不同。丹尼尔·斯特恩( Daniel )在这方面做了一些。此外，他还编写了一个在线工具，它为跨浏览器范围的输入样式- 生成基本的css样式，我使用这些样式，但在使用z-index参数时遇到了一些问题。在webkit样式中，通过将posi

浏览 3提问于2015-06-09得票数 4

回答已采纳

1回答

将鼠标悬停在不是子体的工具提示上时，将悬停样式保持在父体上

html、css、hover、webpage

我有一个"parent“div，它包含一个带有工具提示控件的元素。工具提示不是父div的子元素，而是直接附加到body元素。当悬停在父对象上时，我们有一种样式，当悬停在工具提示上时，该样式就会丢失。有没有一种基于CSS的解决方案，可以将悬停样式保持在父级上，同时将鼠标悬停在不是父级后代的工具提示上？

浏览 1提问于2018-09-12得票数 0

3回答

更改svg形状颜色的javascript

javascript、svg

您好，有没有一种使用javascript的方法，例如使用按钮来更改svg形状的颜色？如果是的话，有人能给我指个方向吗?谢谢

浏览 0提问于2012-04-10得票数 3

回答已采纳

1回答

在css中更改输入类型范围栏的颜色

html、css、input、webkit

我正在我的代码中使用输入类型范围栏，并且想要更改颜色。我不想对它做任何改变，我只想把它的颜色从蓝色改为其他颜色。我知道我可以通过css访问它，如下所示： -webkit-appearance: none;但是这改变了输入范围，我只想改变颜色。

浏览 0提问于2020-07-17得票数 3

4回答

如何在带有CSS模块的react组件中有条件地应用样式？

reactjs、styled-components、css-modules

默认情况下，我使用CSS模块在本地对所有样式进行范围调整。根据我的理解，我能够使用本地样式表(./movieCard.styl)中设置的类名的唯一方法是使用属性styleName="something"。因此，className="something"将无法访问./movieCard.styl中的样式。我想我可以在HTML元素上使用style={}方法，但是

浏览 0提问于2018-07-24得票数 6

1回答

jQuery倾斜面距离滑块？

jquery、jquery-ui、slider、range、rangeslider

任何关于如何设置范围滑块样式的想法都可以这样做，在拖动滑块时，突出显示的填充沿倾斜方向增加(仅以颜色/设计为例)：

浏览 0提问于2014-02-23得票数 2

回答已采纳

2回答

如何在浏览器放大时防止CSS内联样式？

css、google-chrome、safari、zooming、inline

在图像滑块上，它强制添加DIV元素的内联样式，特别是它的高度(这显然覆盖了任何其他样式)。这个问题可以在这里看到，在打开页面后，将页面放大1或2级，然后在缩放时点击刷新。当我使用firebug检查元素时，Safari和Ch

浏览 2提问于2011-09-23得票数 0

回答已采纳

3回答

正在检测jQuery移动设备中的选择滑块更改事件

event-handling、jquery-mobile

在jQuery移动中检测选定滑块更改的可靠方法是什么？我尝试绑定一个处理程序来更改select控件本身的事件，但它在初始页面显示时触发，然后在单击时多次触发，有时甚至在悬停时触发(在桌面浏览器中)。此行为的最小工作示例发布在此处：任何帮助都是非常感谢的。

浏览 0提问于2011-08-02得票数 13

回答已采纳

1回答

在Chrome中重新显示html输入范围缩略图

javascript、html、css、google-chrome

我正在构建一个页面，在这个页面中，我希望获得一定范围内的用户输入，但我不希望预先给用户设置一个默认值。因此，我尝试做的是有一个输入范围滑块，默认情况下有一个样式隐藏拇指的类，然后使用滑块的onchange事件，删除该类，以便thumb再次显示。我遇到的奇怪现象是，这可以在Safari中运行，但不能在Chrome中运行(目前只能使用webkit)。一切似乎都在正确更新(例如，类被更改了，css

浏览 4提问于2017-01-05得票数 1

回答已采纳

1回答

更改事件上的火狐jQuery无法按预期工作

javascript、jquery、html、css、firefox

在拖动句柄后，我试图更改Firefox中的范围滑块元素的背景梯度。我为range滑块设置了一个基本样式，其外观如下：然后，当滑块被更改时)，这将将句柄后面的所有内容设置为指定的颜色。然而，在Firefox中，在拖动句柄时不会添加样式。我确实注意

浏览 2提问于2015-08-17得票数 1

回答已采纳

1回答

WOW Slider在网页上实现时如何解决jQuery冲突

jquery

我在上有一个网站有一个WOW滑块样式表<link href="/slider/engine2/style.css" rel="stylesheet" type="text/css" />和支持WOW滑块的jQuery engine的存在。我的网站有一个鼠标悬停菜单，只要没有WOW Slider样式表和jQuery引擎，它就会起作用

浏览 3提问于2012-12-10得票数 0

回答已采纳

1回答

如何在html5输入[type=range]中实现背景色？

css

因为我只在webkit中工作，所以我设计它是因为我的愿望来自于许多网络sources.here，这是我为滑块(inputtype=range)设计的。webkit-appearance:none; background-color:#000; height:5px;现在的问题是滑块应该包含两种颜色ALso，我想在滑块中得到拇指的原始图像。这有可能吗？

浏览 2提问于2011-03-02得票数 2

1回答

SharePoint母版页未设置链接样式

css、sharepoint、master-pages、sharepoint-designer

我使用SharePoint Designer 2010构建了一个母版页，它引用了一个外部样式表，如下所示：在母版页的设计模式中，所有样式都会正确反映，当我基于该母版页创建新的.aspx时也

浏览 0提问于2014-05-16得票数 1

2回答

将“悬停”预览支持添加到jQuery UI滑块

jquery、jquery-ui、slider

我使用的是1- 10等级的jQuery UI滑块。我想为滑块添加悬停支持。现在，当您滑动它时，滑块会随着您的分级比例的增加而变色。它还会在滑块外部显示1/10的比例。我想为人们添加的能力，以悬停在滑块的一部分，并有它改变为适当的颜色和改变1/10到适当的评级基于光标

浏览 2提问于2012-07-15得票数 0

回答已采纳

3回答

Vuetify滑块:在鼠标悬停并单击时将鼠标光标更改为指针

javascript、html、css、cursor、vuetify.js

当鼠标悬停或单击滑块(v-slider)的蓝色圆形按钮元素时，vuetify中有没有更改鼠标光标的方法？这就是它现在的样子/行为： ? 这就是我希望它看起来/表现出来的样子： ? 我尝试了内联样式，但它不起作用：style="cursor: pointer"

浏览 90提问于2019-03-24得票数 5

回答已采纳

3回答

在鼠标悬停时更改字体颜色，然后单击javascript或html

javascript、html、css

我有几个html链接，我将onmouseover和onmouseout设置为更改颜色，我希望能够做的是，当我单击其中一个链接时，链接被设置为某种颜色，鼠标悬停效果不再对所单击的链接起作用，而是对其他链接起作用<font style="font-family:pirulen; font-size:12px; margin-left:10px; "><b>Painting</b></font></a>

浏览 0提问于2012-01-18得票数 0

回答已采纳

1回答

如何设置此元素的样式

jquery

如果元素被悬停，我有这个脚本来设置box-shadow。它还应该同时删除父样式： boxShadow : "inset 0px 0px 0px 1px #f80" boxShadowe.stopPropagation(); $(this).parent().css(out);}); 如果您查看此示例，您将看到，如果您悬停跨度，

浏览 0提问于2013-03-24得票数 1

点击加载更多