Working on a webpage, I have created a new view to display categories and devised a solution for categorizing all the data in the app.
However, I am facing some unresolved issues.
The problem lies in the fact that when I first open my webpage, all the categories from the list are visible. What I want is for the categories to only become visible after clicking on the category items.
Below is a snippet of my code:
.wrap {
max-width: 1100px;
width: 90%;
margin: auto;
}
.category_list .ct_item-active {
background: #2D3E50;
}
// Other CSS styles...
$(document).ready(function () {
// JavaScript functions...
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
This current setup does not showcase all the categories on the main page. On reloading the page, however, all the categories become visible even though there are more than three. I aim to display these categories only upon pressing the category items.