JSFiddle - React, Tailwind, and code Playground

by xemplifly

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/dot-luv/jquery-ui.css">
<div id="tabs">
    <ul>
        <li><a href="#tab-1">Regular Tab 1</a>
        </li>
        <li><a href="#tab-2" title="page1.php" class="openpage">Preview Tab 1</a>
        </li>
        <li><a href="#tab-3" title="page2.php" class="openpage">Preview Tab 2</a>
        </li>
    </ul>
    <div id=tab-1>This is tab 1 content</div>
    <div id=tab-2>This is tab 2 preview</div>
    <div id=tab-3>This is tab 3 preview</div>
</div>

JavaScript

$("#tabs").tabs({
    event: 'mouseover'
});
$('.openpage').click(function () {
    window.location = $(this).attr('title');
});