Markup and Scripting

The HTML markup for a wijTabs widget looks like this.

Markup	Copy Code
<h3>Protein Translation Process</h3> <p>The translation process is divided into three steps:</p> <div id="tabs"> <ul> <li><a href="#tabs-1">Step 1</a></li> <li><a href="#tabs-2">Step 2</a></li> <li><a href="#tabs-3">Step 3</a></li> </ul> <div id="tabs-1"> <p> <strong>Initiation</strong>: When a small subunit of a ribosome charged with a tRNA+the amino acid methionine encounters an mRNA, it attaches and starts to scan for a start signal. When it finds the start sequence AUG, the codon (triplet) for the amino acid methionine, the large subunit joins the small one to form a complete ribosome and the protein synthesis is initiated. </p> </div> <div id="tabs-2"> <p> <strong>Elongation</strong>: A new tRNA+amino acid enters the ribosome, at the next codon downstream of the AUG codon. If its anticodon matches the mRNA codon it basepairs and the ribosome can link the two aminoacids together.(If a tRNA with the wrong anticodon and therefore the wrong amino acid enters the ribosome, it can not basepair with the mRNA and is rejected.) The ribosome then moves one triplet forward and a new tRNA+amino acid can enter the ribosome and the procedure is repeated.</p> </div> <div id="tabs-3"> <p><strong>Termination</strong>: When the ribosome reaches one of three stop codons, for example UGA, there are no corresponding tRNAs to that sequence. Instead termination proteins bind to the ribosome and stimulate the release of the polypeptide chain (the protein), and the ribosome dissociates from the mRNA. When the ribosome is released from the mRNA, its large and small subunit dissociate. The small subunit can now be loaded with a new tRNA+methionine and start translation once again. Some cells need large quantities of a particular protein. To meet this requirement they make many mRNA copies of the corresponding gene and have many ribosomes working on each mRNA. After translation the protein will usually undergo some further modifications before it becomes fully active.</p> </div> </div>

Markup

Copy Code

<h3>Protein Translation Process</h3>
<p>The translation process is divided into three steps:</p>
<div id="tabs">
    <ul>
        <li><a href="#tabs-1">Step 1</a></li>
        <li><a href="#tabs-2">Step 2</a></li>
        <li><a href="#tabs-3">Step 3</a></li>
    </ul>
    <div id="tabs-1">
        <p>
            <strong>Initiation</strong>: When a small subunit of a ribosome charged with a tRNA+the amino 
            acid methionine encounters an mRNA, it attaches and starts to scan for a start signal. When 
            it finds the start sequence AUG, the codon (triplet) for the amino acid methionine, the large 
            subunit joins the small one to form a complete ribosome and the protein synthesis is initiated.
        </p>
    </div>
    <div id="tabs-2">
        <p>
            <strong>Elongation</strong>: A new tRNA+amino acid enters the ribosome, at the next codon 
            downstream of the AUG codon. If its anticodon matches the mRNA codon it basepairs and the 
            ribosome can link the two aminoacids together.(If a tRNA with the wrong anticodon and 
            therefore the wrong amino acid enters the ribosome, it can not basepair with the mRNA and 
            is rejected.) The ribosome then moves one triplet forward and a new tRNA+amino acid can enter 
            the ribosome and the procedure is repeated.</p>
    </div>
    <div id="tabs-3">
        <p><strong>Termination</strong>: When the ribosome reaches one of three stop codons, for example 
        UGA, there are no corresponding tRNAs to that sequence. Instead termination proteins bind to the 
        ribosome and stimulate the release of the polypeptide chain (the protein), and the ribosome 
        dissociates from the mRNA. When the ribosome is released from the mRNA, its large and small 
        subunit dissociate. The small subunit can now be loaded with a new tRNA+methionine and start 
        translation once again. Some cells need large quantities of a particular protein. To meet this 
        requirement they make many mRNA copies of the corresponding gene and have many ribosomes working 
        on each mRNA. After translation the protein will usually undergo some further modifications 
        before it becomes fully active.</p>
    </div>
</div>

You can initialize the widget with the following jQuery script.

Script	Copy Code
<script type="text/javascript"> $(document).ready(function () { $("#tabs").wijtabs(); }); </script>

The markup and script featured here results in the following live widget. Click a tab to see its content.

KO

KO Tabs Binding

Reference

wijtabs API