javascript - jQuery Show 隐藏错误

Question

所以我不明白为什么我的 more 和 less show 函数会与 show hide 函数混淆。我已经包含了一个 jsfiddle 和一个演示。它曾经很好用，但当我再次尝试打开它时却搞砸了。按下左上角的 img 几次，您将看到问题。文本超出 div!

Jsfiddle:http://jsfiddle.net/LLDLT/ 演示:http://aucblock.x10.mx/eric/edited/

jQuery 代码:

$("#e").click(function (e) {
    $("#u").hide(200);
    $("#n").hide(200);
    $("#l").hide(200);
    $("#a").hide(200);
    $("#m").hide(200);
    $(".eew").hide(200);
    $("#s").show(200);
    $("#re").animate({
        "margin-left": "0px"
    }, 200);
    $("#r").animate({
        "margin-left": "0px"
    }, 200);
    $("#s").animate({
        "margin-left": "2px"
    }, 200);
    $("#u").animate({
        "margin-left": "2px"
    }, 200);
    $("#n").animate({
        "margin-left": "2px"
    }, 200);
    $("#l").animate({
        "margin-left": "2px"
    }, 200);
    $("#a").animate({
        "margin-left": "2px"
    }, 200);
    $("#m").animate({
        "margin-left": "2px"
    }, 200);
    e.stopPropagation();
    $('body').on('click', '.highl', function () {
        if ($('#s').css('height') === '190px') {
            $('#s').animate({
                'height': '92px'
            }, 200);
            $(".highl").text("More");
            $(".eew").hide(200);
        } else {
            $('#s').animate({
                'height': '190px'
            }, 200);
            $(".highl").text("Less");
            $(".eew").css("display", "inline");
        }
    });
    $('body').on('click', '.tri', function () {
        $('#s').hide(200);
        $('.eew').hide();
        $('#s').animate({
            "height": "92px"
        }, 200);
    });
});

Answer 1

因此，如果您查看检查器，您会看到父级 div.popu 的确定高度设置为 92 像素。在这种情况下，跨度中的溢出文本将始终出现在背景图像之外，除非您允许高度为“自动”或将 overflow:scroll 添加到 .popu