html鼠标悬停出现新元素,CSS：我如何将鼠标悬停在一个元素上，并显示另一个元素？...

我有一个导航面板，当您将鼠标悬停在灯具

上时，它会显示从主导航面板下拉的面板中的前5个灯具。CSS：我如何将鼠标悬停在一个元素上，并显示另一个元素？

我试图实现这个使用CSS与:hover。这是:hover IM的例子试图让：http://jsfiddle.net/EajKf/189/

HTML：

Home
Fixtures
Manchester City

CSS：

#nav li a.fixtures:hover{

color: #000;

margin-top:1px;

-webkit-transition-duration: 0.4s;

cursor: pointer;

text-decoration: none;

font-family: Arial, Helvetica, sans-serif;

box-shadow: 0px 0px 20px rgba(0,235,255,0.8);

-webkit-box-shadow: 0px 0px 20px rgba(255,102,51,0.8);

background: rgba(255,102,51,0.8);

opacity: 50%;

}

#nav li a.hidden{

margin-top: 50px;

padding: 100px;

background-color: #fff;

display: none;

}

#nav li a.fixtures:hover #nav li a.hidden{

display: block;

}

感谢您的答案！

2013-06-26

sam

它可能会更好，如果你使用JavaScript。这会很容易。我认为CSS没有这种选择。 –

请勿使用相同的ID。您能否在您的示例代码中添加子菜单的html？ –

你应该使用toggle/toggleclass –

html鼠标悬停出现新元素,CSS：我如何将鼠标悬停在一个元素上，并显示另一个元素？...相关推荐

php 元素添加子元素,css,html_怎么在添加的子元素上继承父元素上已存在的子元素的属性？，css,html,javascript - phpStudy...
怎么在添加的子元素上继承父元素上已存在的子元素的属性? 请问如何使添加后的子元素(tr)也能在鼠标经过前后继续保留其存在的子元素上的属性? dom的基础应用 window.οnlοad=functio ...
vue 悬停显示另一个div_CSS或者JS实现鼠标悬停显示另一元素
想达到鼠标悬停到元素a上,显示另一个元素b,可以通过css实现也可以通过js实现. js: 写两个函数:mouseenter,mouseleave,例如:其中 $("#a").mo ...
html鼠标事件有哪些,JavaScript事件类型：鼠标事件
Dom3级事件中定义了9个鼠标事件 1.click事件 click:用户单击鼠标主按钮(一般为左边按钮)或者在获得焦点的前提下按回车键时触发. click()方法也可以触发click 事件. 2.db ...
CSS设置了正确的背景图片位置，网页上却显示不出来?
关于CSS中设置背景图片但在网页上未显示做如下笔记,和大家分享.. 如有说的不对或不恰当的地方,希望读者指出,共同进步. 今天在写一个小项目的时候在一个点上疑惑了许久,明明我的背景图片路径设置的不会错 ...
html5hover鼠标悬停,不使用hover外部CSS样式实现hover鼠标悬停改变样式
不能使用外部CSS样式实现hover鼠标悬停改变样式在DIV+CSS网页布局中,有时我们不能直接使用外部CSS样式控制DIV样式,比如对a设置a:hover样式. 可以使用onMouseOver(鼠 ...
html桌面卡牌效果,html+css实现响应式卡片悬停效果
话不多,看效果先: 卡片悬停,响应式卡片,简约效果. 实现: 1. 定义标签,.kapian为最底层盒子,然后两个子盒子一个放图片,一个放文本: The aurora borealis natural ...
css 菜单栏悬停_在CSS中构建悬停菜单
css 菜单栏悬停 A good menu design is an important part of any website or web app UI. Using only modern HT ...
html的悬停图片缓慢放大,css3怎么实现鼠标悬停图片时缓慢变大效果?（图文+视频）...
本篇文章主要给大家介绍当鼠标滑过图片时实现放大效果的具体方法. 当我们在浏览各大电商网站时,最常见的图片动态效果,应该就是鼠标移入图片即悬停在图片时出现放大的效果了.实现这样的动态效果主要是为了突出产 ...
JS+CSS控制左右切换鼠标可控的无缝图片滚动代码
代码简介: 以前见过这种效果,但是是基于FLASH技术,现在是纯用JS实现的,代码有点多,不过效果还不错,实际上它也是一个图片滚动,只不过它完全是用鼠标点击控制的,也就是说鼠标不点击的时候它是静止的, ...

html鼠标悬停出现新元素,CSS：我如何将鼠标悬停在一个元素上，并显示另一个元素？...

html鼠标悬停出现新元素,CSS：我如何将鼠标悬停在一个元素上，并显示另一个元素？...相关推荐

最新文章

热门文章