当前位置：文江博客话题详情

jQuery + CSS + IE问题：页面加载时隐藏元素短暂出现

发布于 2024-10-11 20:05:42 字数 615 浏览 4 评论 0原文

还有其他人经历过下面描述的场景吗？

为了举例，这里有一个非常基本的描述：

#menuHolder 包含菜单项（#itemA、#itemB、#itemC,...#itemZ)

在 CSS 中，我将 #menuHolder 的 溢出设置为隐藏。

使用 jQuery，我将 #menuHolder 设置为 0 的 minHeight，然后当鼠标悬停在特定元素上时将其扩展为 300 的 maxHeight。

在 FF、Safari 或 Chrome 中没有问题...但在 IE 中会发生以下情况：

短暂地出现 #itemA、#itemB、#itemC,...#itemZ 出现在彼此的顶部。然后它们就会消失并表现正常。

就好像在页面加载之前，overflow:hidden 或 minHeight 都不会被识别。

有什么想法吗？

谢谢乙

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

会傲 2024-10-18 20:05:42

ie（如果我没记错的话，至少最多7）不知道min-height，

解决方案是使用一些像这样的CSS，使用一些

min-height:100px;
height:100px; /* for ie7 */
height:auto !important; /* for all others */

条件注释技巧（如 http://html5boilerplate.com

ie (at least up to 7 if i remember correctly) dont know about min-height

the solution is to use some css like that

min-height:100px;
height:100px; /* for ie7 */
height:auto !important; /* for all others */

it would be event better to target ie6/7 with some conditional comment tricks like in http://html5boilerplate.com

回复收藏 0 原文

我早已燃尽 2024-10-18 20:05:42

也许您应该在 css 中设置容器 display:none ，使用 jquery 预加载现在不可见容器中使用的任何图像，然后在 jquery 中当鼠标悬停时使用适当的高度而不是 min- 和 max- 。

回复收藏 0 原文

我不会写诗 2024-10-18 20:05:42

在某些情况下，类似这样的方法会起作用：

在页面加载期间不得出现的元素上，将其隐藏在标记中：

<ul id='my_element' style='visibility:hidden'>

然后，在应用 jquery 效果来显示它（即，slideDown()）之前，删除该属性并重新隐藏它：

$me = $('#my_element');  // cache it to improve performance
$('#some_other_element').click(function() {
  $me('style','visibility:visible').hide();
  $me.slideDown(800);
});

有一天 IE 支持将不再需要这样的滑稽动作。在那之前，希望这会有所帮助。

In some cases, something like this will work:

On the element that must not appear during the page load, hide it in the markup:

<ul id='my_element' style='visibility:hidden'>

Then, before you apply a jquery effect to show it (ie, slideDown()), remove the attribute AND re-hide it:

$me = $('#my_element');  // cache it to improve performance
$('#some_other_element').click(function() {
  $me('style','visibility:visible').hide();
  $me.slideDown(800);
});

One day IE support will not require such antics. Until then, hope this helps.

回复收藏 0 原文