如何在悬停后保持div宽度？
如何在悬停后保持div宽度？
提问于 2012-08-20 10:11:33
悬停后如何保持div宽度？
这是HTML代码
<div>
<a href="/kcms1/The-Plant/Refining.aspx" style="white-space:nowrap; position:relative;"> Refining</a>
<a href="/kcms1/The-Plant/Products.aspx" style="white-space:nowrap; position:relative;"> Products</a>
<a href="/kcms1/The-Plant/Process.aspx" style="white-space:nowrap; position:relative;"> Process</a>
<a href="/kcms1/The-Plant/Quality-Assurance.aspx" style="white-space:nowrap; position:relative;"> Quality Assurance</a>
<a href="/kcms1/The-Plant/Safety.aspx" style="white-space:nowrap; position:relative;"> Safety</a>
</div>========
请这是我的主菜单，宽度是不固定的，当鼠标悬停在(质量保证)主目录上时，宽度增加了大约2个像素。
我想让鼠标悬停是大胆的。
我习惯使用字母间距，但不是很好：
你可以在这里看到我的问题
回答 3
Stack Overflow用户
回答已采纳
发布于 2012-08-20 10:18:12
目前，菜单的宽度由最宽的元素决定。
“声音和训练”是目前最宽的元素，因此，当它是粗体时，通过扩展菜单的宽度来适应额外的宽度。这是因为粗体文本比标准文本宽。
你不能调整菜单的宽度有什么原因吗？
如果你不能确定菜单的宽度--你可以选择一种不同的方式在悬停时突出显示所选的元素(下划线，这是一个常见的选择)。
请参阅此处的相关讨论：
Stack Overflow用户
发布于 2012-08-20 20:26:54
尝试使用以下命令设置div样式溢出：
overflow:隐藏；
所以：
<div style="overflow:hidden;width:250px;height:200px;">
content here
</div>您将需要设置一个宽度，如果您使用这个，我相信，所以也添加宽度(您可以设置您自己的宽度到您需要的)相同的高度。
Stack Overflow用户
发布于 2013-12-05 13:15:07
另一个想法是使用一些JavaScript来捕获菜单div上的鼠标输入事件，获取div的outerWidth()，然后设置菜单div的最大宽度。悬停将不会使用此选项展开框。
var width = $this.outerWidth();
$(this).css({"max-width": width+"px"});只需确保菜单项上的overflow设置为visible：
$("menu items").css({overflow: "visible"});最好在mouseleave上清除max-width。
这对我来说很有效。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/12035805
复制相关文章
相似问题
iTunes应用程序屏幕截图
ITunes应用程序屏幕截图被拒绝
应用程序信息共享就像iTunes应用程序一样
为批准的应用程序编辑屏幕截图iTunes连接
如何为应用程序制作屏幕截图？
添加站长 进交流群
领取专属 10元无门槛券
AI混元助手 在线答疑
关注 腾讯云开发者公众号
洞察 腾讯核心技术
剖析业界实践案例
腾讯云开发者
