This document uses Div + Css + JS to show and hide multiple Content modules. Note: To introduce the jQuery package, I introduce the jquery-1.3.2.min.js, in order to facilitate the demonstration, no longer take out the code alone.
<Title> Div + Css + JS: Multiple display/hide content modules-helping customers </title> <style>. mainbox h3 {margin-bottom: 0px; line-height: 32px; height: 32px; padding-left: 1em; font-size: 13px; font-weight: 700; border-bottom: 1px solid # E6E7E1; border-top: 4px solid # E8F0F7; border-left: 1px solid # E8F0F7; border-right: 1px solid # E8F0F7 ;}. mainbox {width: 880px; position: relative; margin-left: auto; margin-right: auto; margin-bottom: 5px ;}. headactions {position: absolute; top: 12px; right: 24px; line-height: 1em ;}. tablelist {width: 880px; margin-left: auto; margin-right: auto; border: 1px solid;} td {background: # e5f1f4 ;} </style> <div class = "mainbox"> <span class = "headactions"> </span>
Tip: the code can be modified before running!