scss 简单的标签系统（jQuery）

Posted 2021-05-17

<div class="container">
    <h1>Simple Tab System.</h1>
    <h2>Accessible via keyboard as well.</h2>
    <p>Keyboard: Just click on page and press Tab.</p>
    <h3>Demo:</h3>
    
    <!-- Tab System starts -->
     <div class="tab-system-ctnr">
        <div class="tabs">
           <a href="#" class="tab-link current" data-tab="tab-1">Tab One</a>
           <a href="#" class="tab-link" data-tab="tab-2">Tab Two</a>
           <a href="#" class="tab-link" data-tab="tab-3">Tab Three</a>
           <a href="#" class="tab-link" data-tab="tab-4">Tab Four</a>
        </div>

        <div id="tab-1" class="tab-content current">
           <p>1111</p>
        </div>
        <div id="tab-2" class="tab-content">
           <p>2222</p>
        </div>
         <div id="tab-3" class="tab-content">
           <p>3333</p>
        </div>
         <div id="tab-4" class="tab-content">
           <p>4444</p>
        </div>
     </div>
     <!-- Tab System ends -->
    
    <hr>
    <h2>Issue:</h2>
    <p>Right now only one tab system per page is possible ¯\_(ツ)_/¯.</p>
    <hr>
    <p><small>Forked from