Use Jquery to set an element closed by default

Question

I have some Jquery that adds a collapse event when you click an icon to slide up and down some content as below:

>>> Traceback (most recent call last):
  File "<console>", line 1, in <module>
ImportError: cannot import name Category

But What I would also like to do is add the same .collapsed-box class to some elements but default so they start collapsed/closed, but that the open and close event still works after.

Would I need to edit the above and or add another function?

Thanks

Answer 1

Initially I thought you could just trigger the click event on all the elements, but you probably don't want to see the animation (i.e., the sliding) when the page loads. Therefore, you would have to add some code for this. I think the following would do:

compareTo

Note: The code above uses var $collapsables = $("[data-widget='collapse']"); $collapsables.each(function() { var $collapsable = $(this), $box = $collapsable.closest(".box"); if ($box.hasClass("collapsed-box")) { $collapsable.children(".fa-minus").removeClass("fa-minus").addClass("fa-plus"); $box.find(".box-body, .box-footer").hide(); } }); , rather than .closest(".box").