vashzero vashzero - 4 months ago 19
CSS Question

Open Folders since Jquery from CSS Script

I have a script on CSS that allows you to simulate a file explorer on HTML.

The problem that I have is that I want to create a button that automatically opens all the folders and subfolders in that list.

Here is an example of the css that is being called when a checkbox is clicked:

li input:checked + ol
background: url('') 44px 5px no-repeat;
background-size: 12px 12px;
margin: -1.25em 0 0 -44px; /* 20px */
padding: 1.563em 0 0 80px;
height: auto;
width: auto;
li input:checked + ol > li { display: block; margin: 0 0 0.125em; }
li input:checked + ol > li:last-child { margin: 0 0 0.063em; }

Live example here:

Is there any way to get the folders open since the click of a button?

Thank you in advance.


I've forked and updated your fiddle with a working solution.

You can use the .prop() to set the value of the checkbox on the click event.

jQuery("#my_button").click(function() {
  $("input").prop("checked", true);