Databases
StackOverflow2013
Postsdbo
PO
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>Use <a href="http://jqueryui.com/" rel="nofollow">jQueryUI</a>. It has everything you need. </p> <p>As the website says:</p> <blockquote> <p>jQuery UI is a curated set of user interface interactions, effects, widgets, and themes built on top of the jQuery JavaScript Library. Whether you're building highly interactive web applications or you just need to add a date picker to a form control, jQuery UI is the perfect choice.</p> </blockquote> <ul> <li>It has <a href="http://jqueryui.com/dialog/#default" rel="nofollow">Popups</a></li> <li>It has <a href="http://jqueryui.com/tabs/" rel="nofollow">Tabs</a></li> </ul> <hr> <p>EXAMPLE An example of tabs within a popup</p> <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false"> <div class="snippet-code"> <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="http://code.jquery.com/jquery-3.1.0.min.js" integrity="sha256-cCueBR6CsyA4/9szpPfrX3s49M9vUU5BgtiJj06wt/s=" crossorigin="anonymous"&gt;&lt;/script&gt; &lt;script src="https://code.jquery.com/ui/1.12.0/jquery-ui.min.js" integrity="sha256-eGE6blurk5sHj+rmkfsGYeKyZx3M4bG+ZlFyA7Kns7E=" crossorigin="anonymous"&gt;&lt;/script&gt; &lt;link rel="stylesheet" href="https://code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css"&gt; &lt;div id="dialog" title="Basic dialog"&gt; &lt;p&gt;This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.&lt;/p&gt; &lt;div id="tabs"&gt; &lt;ul&gt; &lt;li&gt;&lt;a href="#tabs-1"&gt;Nunc tincidunt&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#tabs-2"&gt;Proin dolor&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#tabs-3"&gt;Aenean lacinia&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;div id="tabs-1"&gt; &lt;p&gt;Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ulla interdum. Phasellus ipsum. Nunc tristique tempus lectus.&lt;/p&gt; &lt;/div&gt; &lt;div id="tabs-2"&gt; &lt;p&gt;Morbi tincidunt, dui sit amet facilisis feugiat, odio metus felis lorem euismod felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et purus.&lt;/p&gt; &lt;/div&gt; &lt;div id="tabs-3"&gt; &lt;p&gt;Mauris eleifend est et tur potenti. Aliquam vulputbitur lorem enim, pretium nec, feugiat nec, luctus a, lacus.&lt;/p&gt; &lt;/div&gt; &lt;/div&gt; &lt;script&gt; $(function() { $( "#tabs" ).tabs(); $( "#dialog" ).dialog({ width: 600 }); }); &lt;/script&gt;</code></pre> </div> </div> </p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload