Use jQuery.tabs () - content overlay page

I really love jQuery. Just trying to figure it out. I like the tab function presented here:

http://jqueryui.com/demos/tabs/#mouseover

I really like it, but I would like it to look a little like the Menu. In particular, I would like the contents of the tab to appear on top of the content on the page (for example, the menu). Also, just like when I move tabs, the content changes when I don't roll over any tabs (or maybe instead when the user clicks anywhere on the page), I need the contents of the tab to go away (for example, the menu) .

So I really want to use it as a menu. If someone knows a menu control that can solve my problem that will work too. I just like that when I hover over an item, a popup appears. I want to add text and two buttons to each div.

Thank!

This is what I originally: This is in the title:

$("#tabs").tabs().find(".ui-tabs-nav").sortable({ axis: 'x' });
$("#tabs").tabs({ event: 'mouseover' });

And this is in the body:

 <div id="tabs">
            <ul>
                <li><a href="#tabs-1">First</a></li>
                <li><a href="#tabs-2">Second</a></li>
                <li><a href="#tabs-3">Third</a></li>
            </ul>
            <div id="tabs-1">Lorem ipsum dolor sit amet, consectetur adipisicing 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.</div>
            <div id="tabs-2">Phasellus mattis tincidunt nibh. Cras orci urna, blandit id, pretium vel, aliquet ornare, felis. Maecenas scelerisque sem non nisl. Fusce sed lorem in enim dictum bibendum.</div>
            <div id="tabs-3">Nam dui erat, auctor a, dignissim quis, sollicitudin eu, felis. Pellentesque nisi urna, interdum eget, sagittis et, consequat vestibulum, lacus. Mauris porttitor ullamcorper augue.</div>
        </div>
+3
source share
2 answers

jQuery supports a very rich plugin model . You might want to take a look at the “Menu Plugin” instead of trying to manipulate the tabs to work like a menu.

+2
source

, , jQuery. , , .

0

Source: https://habr.com/ru/post/1763117/


All Articles