如何删除隐藏后的李空间

How to remove li space after hiding it?

本文关键字：李空间 空间 隐藏 删除 何删除      更新时间：2023-09-26

如何隐藏li并移除其空间。以下代码用于在图像之间传输，但当隐藏前一个li时，会出现空白。

<script type="text/javascript">
    $(document).ready(function () {
        var selectedIndex = 1;
        $("#slide" + selectedIndex + " img").fadeIn(500);
        $("ul.captios li").click(function () {
            var id = $(this).attr("id").split("_")[1];
            $("#slide" + selectedIndex + " img").fadeOut(500, function () {
                $("#slide" + id + " img").fadeIn(500);
                $("#slide" + selectedIndex).css("display:none;");
                selectedIndex = id;
            });
        });
    });
</script>

html

 <div id="gal-container">
        <div id="slides-wrapper">
            <ul class="slides">
                <li id="slide1"><img  class="hide" src="imgs/img1.jpg" /></li>
                <li id="slide2"><img  class="hide" src="imgs/img2.jpg" /></li>
            </ul>
        </div>
        <div id="caption-wrapper">
           <ul class="captios">
                <li id="caption_1"><a href="#">img1</a></li>
                <li id="caption_2"><a href="#">img2</a></li>
            </ul>
        </div>
    </div>

为什么不使用：

        $("#slide" + selectedIndex).hide();

或者更好的可能是：

 $("#slide" + selectedIndex).fadeOut(500, function () {
      $("#slide" + id).fadeIn(500);
      selectedIndex = id;
 });

您错误地调用了.css()。您可以向它传递一个字符串，这是CSS属性的名称，它将充当"getter"，返回该属性的值。

或者，您可以向它传递两个字符串，一个CSS属性的名称和一个值，该值将充当"setter"，将该属性设置为具有该值。

因此，您需要的不是$("#slide" + selectedIndex).css("display:none;");，而是$("#slide" + selectedIndex).css("display", "none");。

您的代码中有一个错误。更改

$（"#slide"+selectedIndex）.css（"display:none；"）；

至

$（"#slide"+selectedIndex）.css（｛display:'none'｝）；或$（"#slide"+selectedIndex）.css（'display'，'none'）；

http://api.jquery.com/css/

不知道这是否是您的问题，但。。。这行不正确：

$("#slide" + selectedIndex).css("display:none;");

应该是：

$("#slide" + selectedIndex).css('display', 'none');
// OR
$("#slide" + selectedIndex).hide();

你把css部分写错了：

$("#slide" + selectedIndex).css("display:none;"); // It will return the css 
                                                  //definition for display:none

使用这个替代：

$("#slide" + selectedIndex).css('display', 'none')

或者hide函数，它可以开箱即用地做完全相同的事情：

$("#slide" + selectedIndex).hide();
相关文章：