Question

我有单选按钮选择，每个单选按钮都有一个进度条，进度条为display:none但是当选中时，收音机进度条将show()，与按钮相同。

现在我的问题出现在我选择一个单选按钮的时候，按钮显示如下：

enter image description here

但有时当我选择一个单选按钮时，按钮已被推到底部，甚至看不到：

enter image description here

我不确定这个问题来自哪里，但是我的客人可能是进度条阻止了它？也许我在我的代码中遗漏了一些我不知道的东西。有谁能帮我检查这个问题？

Click here for jsfiddle

更新了部分

我发现如何将按钮推到底部，将鼠标悬停并将鼠标悬停4到5次然后选择一个选项，然后按钮将推到底部。到目前为止还没有找到任何解决方案，任何人都知道如何修复请帮助。非常感谢。

Answer 1

从margin-top: -22px移除.popup_survey_whitebox_percent并替换为

position: relative;
top: -22px;

Fiddle

Answer 2

最后我找到了解决这个问题的方法。

      $("#popup_survey_whitebox").hover(function () {
    $('#popup_survey_whitebox_content').finish().animate({
        opacity: 1,
        height: "toggle"
    }, 500, function () {
        $("label#popup_survey_label_title").text(orig); // Here put the original text.

    }).css('position', 'relative');

}, function () {
    $('#popup_survey_whitebox_content').finish().animate({
        opacity: 1,
        height: "toggle"
    }, 500, function () {
        $("label#popup_survey_label_title").text(newText); // Here put the new text with "..."

    }).css('position', 'relative');
});

对于两个动画

将$('#popup_survey_whitebox_content').stop()更改为$('#popup_survey_whitebox_content').finish()

Answer 3

正如你在答案中所提到的那样，finish有效，但如果你快速进入/退出（它会立即跳到动画的终点，并且可以＆＃34;闪烁＆＃），会给你带来一些奇怪的体验。 34。）

可以通过重置悬停上的height属性来解决此问题＆＃39; out＆＃39;逻辑。当您快速悬停/退出时，将设置高度值，然后在之后使用。

这里有一个小提示：http://jsfiddle.net/v07vt9gz/5/

逻辑：

$(this).css('height', ''); // reset value

不确定影响按钮显示的是什么 - 更新

3 个答案: