我想看看:hover我在Chrome中徘徊的主播风格.在Firebug中,有一个样式下拉列表,允许我为元素选择不同的状态.我似乎无法在Chrome中找到类似内容.我错过了什么吗？
我认为这是一个非常基本的问题,但我不确定如何做到这一点.
我想做的是当一个人div徘徊时,它会影响另一个人的属性div.
例如,在这个简单的例子中,当你将鼠标悬停在#cube它上面时,会改变background-color但我想要的是当我将鼠标悬停在上面时#container,#cube会受到影响.
div {
outline: 1px solid red;
}
#container {
width: 200px;
height: 30px;
}
#cube {
width: 30px;
height: 100%;
background-color: red;
}
#cube:hover {
width: 30px;
height: 100%;
background-color: blue;
}<div id="container">
<div id="cube">
</div>
</div>在stackoverflow中,当我们将鼠标悬停在用户的声誉上时,我们会看到一个文本.我在很多地方看过这个,源代码告诉我它可以在没有js的情况下完成.我试过并且只得到了这个 -
<div="text">hover me</div>
我使用HTML列表和CSS创建了一个水平菜单.除非您将鼠标悬停在链接上,否则一切都会正常工作.你看,我为链接创建了一个大胆的悬停状态,现在由于大胆的大小差异,菜单链接发生了变化.
我遇到与此SitePoint帖子相同的问题.但是,该帖子没有适当的解决方案.我到处寻找解决方案而找不到解决方案.当然,我不可能是唯一一个试图这样做的人.
有没有人有任何想法？
PS:我不知道菜单项中文本的宽度,所以我不能只设置li项的宽度.
这是我的代码:
HTML:
.nav { margin: 0; padding: 0; }
.nav li {
list-style: none;
display: inline;
border-left: #ffffff 1px solid;
}
.nav li a:link, .nav li a:visited {
text-decoration: none;
color: #000;
margin-left: 8px;
margin-right: 5px;
}
.nav li a:hover{
text-decoration: none;
font-weight: bold;
}
.nav li.first { border: none; }CSS:
<ul class="nav">
<li class="first"><a href="#">item 0</a></li>
<li><a href="#">item 1</a></li>
<li><a href="#">item 2</a></li>
<li><a href="#">item 3</a></li>
<li><a href="#">item 4</a></li>
</ul>在新的Angular2框架中,有没有人知道像事件一样悬停的正确方法？
在Angular1中有ng-Mouseover,但似乎没有结转.
我查看了文档但没有找到任何内容.
当div悬停时,CSS过渡效果会移动div.
正如您在示例中看到的那样,问题是"转换"转换具有可怕的副作用,即使div中的图像向下/向右移动1px(并且可能稍微调整一下？)以使其显示出来的地方和焦点......
小故障似乎应用了悬浮效果的整个时间,并且从试验和错误的过程我可以肯定地说,只有当翻译过渡移动div时才会出现(框阴影和不透明度也被应用但是没有区别)删除时的错误).
在创建一个JSFiddle来说明问题时,我偶然发现了一个有趣的观察结果.只有页面有滚动条时才会出现此问题.所以只有一个div实例的例子很好,但是一旦添加了相同的div,因此页面需要滚动条,问题再次出现......
在许多网站上,例如http://www.clearleft.com,您会注意到当链接悬停时,它们将淡入不同的颜色,而不是立即切换,默认操作.
我假设JavaScript用于创建此效果,有谁知道如何？
我创建了一个带有前一个和下一个按钮的旋转木马,它们始终可见.这些按钮具有悬停状态,它们变为蓝色.在触控设备(如iPad)上,悬停状态是粘性的,因此按下按钮后按钮会保持蓝色.我不希望这样.
我可以为每个按钮添加一个no-hover类ontouchend,并使我的CSS像这样:button:not(.no-hover):hover { background-color:
blue; }但这可能对性能非常不利,并且不能正确处理Chromebook Pixel(同时具有触摸屏和鼠标)等设备.
我可以添加一个touch类documentElement,并使我的CSS像这样:html:not(.touch) button:hover { background-color: blue;
}但这也不适用于同时具有触摸和鼠标的设备.
我更喜欢的是删除悬停状态ontouchend.但这似乎不太可能.聚焦另一个元素不会消除悬停状态.手动点击另一个元素,但我似乎无法在JavaScript中触发它.
我发现的所有解决方案似乎都不完美.有完美的解决方案吗？
我有一些我以前建立的网站,使用jquery鼠标事件...我只是有一个ipad,我注意到所有鼠标悬停事件都是通过点击转换...所以例如我必须做两次点击而不是一次..(第一次悬停,比实际点击)
有解决方法吗？也许是一个jquery命令我shoudl已经使用而不是鼠标悬停/出去等..谢谢!
使用这样的HTML:
<p>Some Text</p>
然后一些CSS像这样:
p {
color:black;
}
p:hover {
color:red;
}
如何允许长时间触摸启用触摸的设备复制悬停？我可以改变标记/使用JS等,但想不到一个简单的方法来做到这一点.