Question

我正在尝试显示一个包含幻灯片的div，并隐藏另一个包含在较大屏幕（即桌面）上生成的图像列表。在较小的屏幕上做相反的事情。两个Div都包含转发器控件，不确定是否会以任何方式干扰，但我认为不会。不确定为什么它不起作用任何建议都会非常感激。

我的jQuery和它试图实现的CSS类;

$(function () {
        $(window).resize(function () { ToggleSlideshow(); });
        ToggleSlideshow();
    });

    function ToggleSlideshow() {
        // Apply your condition here to toggle the visibility of the slide show
        if ($(window).width() < 500) {
            $("#slideShowContainer").addClass(".hiding");
        $("#imgList").addClass(".showing");
    } else {
            $("#slideShowContainer").addClass(".showing");
    $("#imgList").addClass(".hiding");
    }
    }

.showing{
display:block;
}
.hiding{
display:none;
}

当我说它不起作用时，我的意思是两者都显示出来并不是我想要实现的。要查看它，请关注this link。

Answer 1

我最终得到了它。我做了如下：

  $(function () {
  $(window).resize(function () { ToggleSlideshow(); });
  ToggleSlideshow();
});

function ToggleSlideshow() {
  // Show your slideshow on widths larger than 500, otherwise show your list of images
  $("#<%=slideShowContainer.ClientID%>").toggle($(window).width() >= 660);
  $("#<%=imgList.ClientID%>").toggle($(window).width() < 660);
}

显示/隐藏包含不能正常工作的转发器的div

1 个答案: