奇怪的可见性行为CSS和jQuery

我有一个定位在顶部的导航栏。里面是一个邮件列表注册字段。将鼠标悬停在包含的div上时，将调用jQuery slideDown，显示先前隐藏的div中的更多输入字段，然后在鼠标移出时调用SlideUp。问题是Firefox中的一切都在运行，但在IE7中，div的底部（可见）部分（绝对位于底部，以便在slideDown和slideUp期间保持在底部）在初始页面加载时不可见。奇怪的是，在悬停（似乎是空的）div之后，空内容神秘地出现，然后即使在滑动和鼠标退出完成后仍然可见。任何人有什么想法吗（我对CSS很在行，但现在不知所措）

这是我的jQuery

//Top Mailing List Drop down animation
$(document).ready(function () {       
    if (jQuery.browser.msie === true) {
        jQuery('#top_mailing')
            .bind(
                "mouseenter",
                function(){
                    $("#top_mailing_hidden").stop().slideDown('slow');
                }).bind("mouseleave",function(){
                    $("#top_mailing_hidden").stop().slideUp('slow');
                });
    }


$('#top_mailing').hoverIntent(
    function () {
        $("#top_mailing_hidden").stop().slideDown('slow');
    }, 
    function () {
        $("#top_mailing_hidden").stop().slideUp('slow');
    });
});

---

可能需要查看JQuery和HTML。。。。。。。。但让我猜一猜：尝试在CSS中为绝对定位的div设置一个固定的高度，看看IE7中会发生什么

编辑：

由于divitis（毫无疑问，您有您的原因）和倾斜缩进，阅读代码有点困难，但我发现了一个可能的原因：

---

此元素的高度

form#top_mailing

与其中隐藏+显示元素的总数（140px+30px）不一致。

可能需要查看JQuery和HTML。。。。。。。。但让我猜一猜：尝试在CSS中为绝对定位的div设置一个固定的高度，看看IE7中会发生什么

编辑：

由于divitis（毫无疑问，您有您的原因）和倾斜缩进，阅读代码有点困难，但我发现了一个可能的原因：

---

此元素的高度

form#top_mailing

与其中隐藏+显示元素的总数（140px+30px）不一致。

首先，您有多个具有相同ID的元素。这是不允许的。ID不能被重用。如果有多个，则需要使用类

id='#top_mailing'
#top_mailing

应该是

class='.top_mailing'
.top_mailing

修复找到的任何其他重复ID，然后重试

<div id="top_mailing">
<form method="POST" id="top_mailing" action="xxx">
<input id="top_mailing" type="text" value="Your E-mail Address" name="Contact0Email" onclick="this.value='';" onfocus="if (this.value == 'Your E-mai Address') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Your E-mail Address';}" />

---

对于初学者，您有多个具有相同ID的元素。这是不允许的。ID不能被重用。如果有多个，则需要使用类

id='#top_mailing'
#top_mailing

应该是

class='.top_mailing'
.top_mailing

修复找到的任何其他重复ID，然后重试

<div id="top_mailing">
<form method="POST" id="top_mailing" action="xxx">
<input id="top_mailing" type="text" value="Your E-mail Address" name="Contact0Email" onclick="this.value='';" onfocus="if (this.value == 'Your E-mai Address') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Your E-mail Address';}" />

这与您的问题不一定相关，但您的CSS选择器无效。在显示

#top#u mailing#top#u mailing#hidden span、#top#u mailing#top#u hidden input、

的行中，您有一个尾随逗号，可能导致该选择器的样式不起作用。

这与您的问题不一定相关，但您有一个无效的CSS选择器。在写着

#top#u mailing#top#u mailing#hidden span、#top#u mailing#top#u mailing?hidden input、

的行上，您有一个尾随逗号，可能会导致该选择器的样式不起作用。

此处的问题由patrick回答：

此处的问题由patrick回答：

某些代码或问题代码托管在某处，这将大大有助于查找问题，而不是模糊的描述。请发布相关信息代码。在本例中，使用了相关的CSS、javascript和HTML。谢谢，这是你的密码。。。你自找的！！！好,发现问题了。我已经在两个单独的中包装了，以便在鼠标悬停触发slideUP动画之前隐藏上半部分。有没有一种方法可以让它的下半部分在IE7的“顶部邮件可见”节目中可见。它会在其他浏览器中显示。某些代码或问题代码托管在某个地方将大大有助于发现问题，而不是含糊不清的描述。请发布相关代码。在本例中，使用了相关的CSS、javascript和HTML。谢谢，这是你的密码。。。你自找的！！！好,发现问题了。我已经在两个单独的中包装了，以便在鼠标悬停触发slideUP动画之前隐藏上半部分。有没有一种方法可以让它的下半部分在IE7的“顶部邮件可见”节目中可见。其他浏览器都会显示。没问题，汤姆。但是，我已经在绝对定位元素上设置了一个固定的高度。添加了一条注释，不确定是否值得查看。没问题，Tom。但是，我已经在绝对定位元素上设置了一个固定的高度。添加了一个注释，不确定是否值得一看。很好。全部修复，问题依然存在：/Hi Patrick。在上面的代码中更新了更改后的top邮件副本。Brian，您将一次一点地看到它。您的HTML标记未正确平衡。“form”标记以“div”标记结尾。收尾表单标签位于错误的位置。确保一切都是完美平衡的，然后让我知道。另外，这不是技术上的错误，而是在你的CSS中，你有多余的引用。这里有一个例子来说明我的意思

#top_mailing#top_mailing(可见)

由于

#top_mailing(可见)

是一个ID，并且在整个页面上只能有一个ID，因此实际上不需要指定它是

#top_mailing

的后代。这并没有错，但在阅读CSS的过程中需要更多的理解。好的，发现了问题。我已经在两个单独的中包装了，以便在鼠标悬停触发slideUP动画之前隐藏上半部分。有没有一种方法可以让它的下半部分在IE7的“顶部邮件可见”节目中可见。它会在所有其他浏览器中显示。很好。全部修复，问题依然存在：/Hi Patrick。在上面的代码中更新了更改后的top邮件副本。Brian，您将一次一点地看到它。您的HTML标记未正确平衡。“form”标记以“div”标记结尾。结束表单标记位于错误的pl中