如何检测切换是否打开它应该显示在一个更大的屏幕上jquery

tez616oj 于 10个月前发布在 jQuery

关注(0)|答案(3)|浏览(96)

这是我的第一篇文章。我正在使用不同尺寸的屏幕。在一个可视SM屏幕上，比如iPad/移动的，当我点击一个按钮时，它会为我切换一个div。然而，我想知道如果我的toggle/div在可视SM模式下打开，我让屏幕“响应”，我如何让它在整个屏幕上切换我的div。只有当它打开时。
代码

function Toggle() {
          if  ($("#btn").click(function () {

                ($("#open").toggle());           //this will display my "#open div"
                ($("#open").css('display', 'block'));
                $("#div").hide();
            }))
            else if{
                    ($("#open").is(":visible"))
                {
                  alert("need a holiday!!!"); //this is what i tried to check if the div is open but it does not detect anything
                   }
             // so if #open is opened and the screen is now responsive it should fill the entire screen
           }
          }

字符串
CSS

<div id="open" class="visible-sm">// contents that are displayed</div>

型
我们将非常感谢您的指导。

jquery

来源：https://stackoverflow.com/questions/47347207/how-to-detect-if-a-toggle-is-open-it-should-be-displayed-on-a-larger-screen-jque

3条答案

按热度按时间

qv7cva1a1#

假设你有一个id为#btn的切换按钮和一个类为#open的对应内容部分：

$(document).ready(function() {
          // Toggle the content on button click
          $("#btn").on("click", function() {
            $("#open").toggle();
          });
        
          // Check if the toggle content is visible initially and on window resize
          function Toggle() {
            if ($("#open").is(":visible")) {
              // Check if the screen size is larger (you can adjust the media query condition)
              if (window.innerWidth >= 768) {
                // Apply your styles for larger screens
                $("#open").css("color", "blue");
              }
            } else {
              // Apply styles when the toggle content is not visible
              $("#open").css("color", "initial");
            }
          }
        
          // Initial check on document ready
          Toggle();
        
          // Check on window resize
          $(window).resize(function() {
            Toggle();
          });
    });

字符串

赞(0）回复(0）举报 10个月前

gywdnpxw2#

你在找这样的东西吗？

if($('#open').css('display') == 'block')
{
//div is visible
}
else{
//not visible
]

字符串

赞(0）回复(0）举报 10个月前

z18hc3ub3#

嗨，你是不是想喜欢这个

function Toggle() {
          if  ($("#btn").click(function () {

                if ($(window).width() < 991) {
                $("#open").toggle();//this will display my "#open div"
                $("#open").css('display', 'block');
                $("#div").hide();
                 }
                 else {
                   alert('More than 991');
                      }
                }))

          }

字符串

赞(0）回复(0）举报 10个月前

我来回答

如何检测切换是否打开它应该显示在一个更大的屏幕上jquery

3条答案

相关问题

热门标签

最新问答