Drop down — Bootstrap accordions snippet

Loading…

Drop down — Bootstrap accordions snippet | GoSnippets

Source Code

1<!DOCTYPE html>
2<html lang="en">
3<head>
4    <meta charset="UTF-8">
5    <meta name="viewport" content="width=device-width, initial-scale=1.0">
6    <title>Tools Interface</title>
7    <link rel="stylesheet" href="styles.css">
8</head>
9<body>
10    <div class="container" id="tools-container">
11        <div class="tool" onclick="toggleDropdown('stock-images-dropdown')">
12            <span>STOCK IMAGES</span>
13            <div class="dropdown" id="stock-images-dropdown">
14                <!-- Categories will be dynamically inserted here -->
15            </div>
16        </div>
17        <div class="tool" onclick="toggleDropdown('video-packs-dropdown')">
18            <span>VIDEO PACKS</span>
19            <div class="dropdown" id="video-packs-dropdown">
20                <!-- Categories will be dynamically inserted here -->
21            </div>
22        </div>
23        <div class="tool" onclick="toggleDropdown('sound-effects-dropdown')">
24            <span>SOUND EFFECTS</span>
25            <div class="dropdown" id="sound-effects-dropdown">
26                <!-- Categories will be dynamically inserted here -->
27            </div>
28        </div>
29        <div class="tool" onclick="toggleDropdown('theme-songs-dropdown')">
30            <span>THEME SONGS</span>
31            <div class="dropdown" id="theme-songs-dropdown">
32                <!-- Categories will be dynamically inserted here -->
33            </div>
34        </div>
35        <div class="tool" onclick="toggleDropdown('free-beats-dropdown')">
36            <span>FREE BEATS</span>
37            <div class="dropdown" id="free-beats-dropdown">
38                <!-- Categories will be dynamically inserted here -->
39            </div>
40        </div>
41    </div>
42    <script src="script.js"></script>
43</body>
44</html>

Drop down — Bootstrap accordions snippet

Source Code

More Accordions snippets

Comments(0)

Working in Tailwind? Explore our Tailwind gallery