Skip to main content

Posts

Showing posts from December, 2018

Multitab menu in HTML 5

How to create a multitab menu in HTML 5? The basic idea is to deal with visibility of the elements. The basic elements Let's say we have 2 tabs; each tab is a button element: <div> <button class="tab"> Tab 1 </button> <button class="tab"> Tab 2 </button> </div> Each tab is associated with a div element as content. We define a common class, such as "content", and an id to distinguish each content: <div id="1" class="content"> ... </div> <div id="2" class="content"> ... </div> Now, we can use a style (either in HTML code or in a CSS) to hide all elements associated with the class named "content": <style> .content { display: none; ... } </style> Visual feedback To provide a visual feedback, we define a style to show vivid colors when the user move the mouse on a tab ( hover ). Also, when t...