This is the simples tabs example, with tabs only with text inside. Just to demonstrate the different layouts you can achieve with DJ-Tabs.
On other demo pages, you will find examples of different content inside the tabs. You can change the themes in the top right from the select box on any page to see the built-in themes. Learn more about the themes. 🎨 .
Look at the menu on the left to see other demo pages of DJ-Tabs.
Tabs open on click
The most common usage, where tabs open when you click a tab
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Tabs open on hover
Just hover over the tab to see its content
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Tabs to the right
Tabs are aligned to the right instead of to the left
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Tabs with 2nd item opened by default
You can control which tab will be opened by default.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Tabs with icon/emoji/image in the tab name
Insert one of the predefined icons, emoji or image inside the tab name, you can also mix them together
Tab 2 with emoji 😃
Tab 3 with and image:
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.