jQuery手风琴仅在移动设备上关闭 [英] jQuery Accordion closed for mobile only

问题描述

由于我的网站具有响应能力，如果在移动设备上查看它，是否可以关闭我的常开手风琴?

这么小的屏幕尺寸会造成很多混乱.

过滤器车辆

内容

有用的资源

内容2

解决方案

我知道您要求仅使用CSS的解决方案，但是没有任何代码段可供使用，这是我能提供的最好的解决方案.希望这会使您对需要做的事情有所了解.假设您正在使用Bootstrap，则需要删除任何/所有打开的面板的.in类.如果您不使用Bootstrap，则需要以触发accorion的开放性作为关闭目标.

来自此处:手风琴默认在移动设备中折叠，默认情况下在台式机Bootstrap 3响应式扩展

$(document).ready(function(){
  var windowWidth = $(window).width();
  if(windowWidth <= 1024) //for iPad & smaller devices
     $('.panel-collapse').removeClass('in')
});

Since my site is responsive, is there a way (preferably using only CSS, since all the markup is already there,) to have my normally open accordion closed if it is viewed on a mobile device?

There's to much clutter for such a small screen size.

Filter Vehicles

Content

Useful Resources

Content 2

解决方案

I know you asked for a CSS only solution, but without any code snippet to go off of, this it the best I can offer. Hopefully this will give you an idea of what needs to be done. Assuming you are using Bootstrap, you need to remove the .in class of any/all open panels. If you aren't using Bootstrap, than what ever is triggering the openness of the accorion needs to be targeted for closing.

Taken from here: Accordions collapse by default in mobile and expanded by default in desktop Bootstrap 3 responsive

$(document).ready(function(){
  var windowWidth = $(window).width();
  if(windowWidth <= 1024) //for iPad & smaller devices
     $('.panel-collapse').removeClass('in')
});

这篇关于jQuery手风琴仅在移动设备上关闭的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！