The jquery. IdTabs TAB USES sample code

  • 2020-03-30 03:52:08
  • OfStack

IdTabs is based on the Jquery encapsulate a plug-in, is mainly used to realize the TAB function, its operation is simple, just to the website: http://www.sunsean.com/idTabs/ to download the plugin JS script files, and reference to the site


<script src="js/jquery.idTabs.min.js" type="text/javascript"></script>

Page HTML layout and invocation are as follows:


<div id="tabsbox" class="tabsbox">
<ul>

<li><a href='#tab0' class='selected'> Technology introduction </a></li>

<li><a href='#tab1' class=''> Technical advantages </a></li>

<li><a href='#tab2' class=''> Technical route </a></li>

<li><a href='#tab3' class=''> Service process </a></li>

<li><a href='#tab4' class=''> Sample request </a></li>

</ul>
<div class="tabscont">

<div id='tab0'>1 Relying on the technology platform of independent research and development, we can provide regular sequencing service and characteristic sequencing service for the majority of researchers, which will help your research! </div>

<div id='tab1'>2 Relying on the technology platform of independent research and development, we can provide regular sequencing service and characteristic sequencing service for the majority of researchers, which will help your research! </div>

<div id='tab2'>3 Relying on the technology platform of independent research and development, we can provide regular sequencing service and characteristic sequencing service for the majority of researchers, which will help your research! </div>

<div id='tab3'>4 Relying on the technology platform of independent research and development, we can provide regular sequencing service and characteristic sequencing service for the majority of researchers, which will help your research!  Text></div>

<div id='tab4'>511111111 Relying on the technology platform of independent research and development, we can provide regular sequencing service and characteristic sequencing service for the majority of researchers, which will help your research! </div>

</div>
</div>

<script type="text/javascript">
$("#tabsbox ul").idTabs("tabs0");
</script>

After adding the CSS style effect, the effect comes out, as shown below:


Related articles: