Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8

Thread: HTML Tabs Issue

  1. #1
    New Coder
    Join Date
    Dec 2008
    Posts
    23
    Thanks
    0
    Thanked 0 Times in 0 Posts

    HTML Tabs Issue

    Hello,

    I have this need of creating multiple nested HTML tabs and below is how I am doing it.

    The issue: Pleaes take a look at Div ID "KI" and "DI" it is not showing the messages in child tab. What am I doing wrong?

    Thanks,
    Ruchir


    <ul class="shadetabs" id="countrytabs">
    <li><a class="selected" href="#" rel="T1">Eagle Home</a></li>

    <li><a href="#" rel="T2">DB HealthCheck</a></li>

    <li><a href="#" rel="T3">EBS HealthCheck</a></li>

    <li><a href="#" rel="T4">CPU Usage</a></li>

    <li><a href="#" rel="T5">Middle Tier</a></li>

    <li><a href="#" rel="T6">Alerts &amp; Reports</a></li>

    <li><a href="#" rel="T7">Metalink</a></li>
    </ul>

    <div style=
    "BORDER-RIGHT: gray 1px solid; PADDING-RIGHT: 10px; BORDER-TOP: gray 1px solid; PADDING-LEFT: 10px; MARGIN-BOTTOM: 1em; PADDING-BOTTOM: 10px; BORDER-LEFT: gray 1px solid; WIDTH: 100%; PADDING-TOP: 10px; BORDER-BOTTOM: gray 1px solid; HEIGHT: 1000px">
    <div class="tabcontent" id="T1">
    <ul class="shadetabs" id="countrytabs1">
    <li><a class="selected" href="#" rel="KI">Key Indicators</a></li>

    <li><a href="#" rel="DI">Database Information</a></li>
    </ul>
    <div style= "BORDER-RIGHT: gray 1px solid; PADDING-RIGHT: 10px; BORDER-TOP: gray 1px solid; PADDING-LEFT: 10px; MARGIN-BOTTOM: 1em; PADDING-BOTTOM: 10px; BORDER-LEFT: gray 1px solid; WIDTH: 95%; PADDING-TOP: 10px; BORDER-BOTTOM: gray 1px solid; HEIGHT: 950px">

    <div class="ctabcontent" id="KI">
    Tab content for Key Indicators here<br>
    Tab content for Key Indicators here<br>
    </div>

    <div class="ctabcontent" id="DI">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>
    </div>
    </div>

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,854
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    Could you provide a link to your page? Or please post the complete code(including DOCTYPE) wrapped inside [CODE][/CODE] tags
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    New Coder
    Join Date
    Dec 2008
    Posts
    23
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Entire Code

    Hello,

    Below is the entire code. Thank you for your time in reading this post.

    -R

    ---
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

    <html>
    <head>
    <title>Coexsys EagleEye for Oracle</title>
    <meta content="Evrsoft First Page" name="GENERATOR"><!-- Javascript file and CSS file embedding for main tabls -->

    <script language="Javascript" src="tabcontent.js" type="text/javascript">
    </script>
    <link href="tabcontent.css" type="text/css" rel="stylesheet"><!-- Images and logs here -->
    </head>

    <body>
    <p dir="ltr" style="Design_Time_Lock: True"><img style="WIDTH: 291px; HEIGHT: 64px" height="64" src="file:///C:/WIDGET/home.jpg" width="340" border=
    "0">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbs p;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img style="WIDTH: 232px; HEIGHT: 62px"
    height="62" src="file:///C:/WIDGET/supprot.gif" width="299" border=
    "0">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</p>

    <blockquote dir="ltr" style="MARGIN-RIGHT: 0px">
    <blockquote dir="ltr" style="MARGIN-RIGHT: 0px">
    <blockquote dir="ltr" style="MARGIN-RIGHT: 0px">
    <blockquote dir="ltr" style="MARGIN-RIGHT: 0px">
    <blockquote dir="ltr" style="MARGIN-RIGHT: 0px">
    <blockquote dir="ltr" style="MARGIN-RIGHT: 0px">
    <p>&nbsp;&nbsp;&nbsp;<img height="59" src="file:///C:/WIDGET/center.gif" width="198" border="0">&nbsp;&nbsp;&nbsp;&nbsp; <img height="54" src="file:///C:/WIDGET/left.gif" width="310"
    border="0"></p>
    </blockquote>
    </blockquote>
    </blockquote>
    </blockquote>
    </blockquote>
    </blockquote>

    <p dir="ltr">Saturday, 17, October, 2009 at 12:18:29 PM</p><!-- Table to display Oracle SID -->

    <table width="100%" bgcolor="#CCCCCC">
    <tbody>
    <tr>
    <td>
    <p dir="ltr" style="MARGIN-RIGHT: 0px" align="right">17/10/2009 at 12:34</p>
    </td>
    </tr>
    </tbody>
    </table>
    <!-- Main tabs HTML -->

    <ul class="shadetabs" id="countrytabs">
    <li><a class="selected" href="#" rel="T1">EagleEye Home</a></li>

    <li><a href="#" rel="T2">DB HealthCheck</a></li>

    <li><a href="#" rel="T3">EBS HealthCheck</a></li>

    <li><a href="#" rel="T4">CPU Usage</a></li>

    <li><a href="#" rel="T5">Middle Tier</a></li>

    <li><a href="#" rel="T6">Alerts &amp; Reports</a></li>

    <li><a href="#" rel="T7">Metalink</a></li>
    </ul>

    <div style=
    "BORDER-RIGHT: gray 1px solid; PADDING-RIGHT: 10px; BORDER-TOP: gray 1px solid; PADDING-LEFT: 10px; MARGIN-BOTTOM: 1em; PADDING-BOTTOM: 10px; BORDER-LEFT: gray 1px solid; WIDTH: 100%; PADDING-TOP: 10px; BORDER-BOTTOM: gray 1px solid; HEIGHT: 1000px">
    <!-- Home Page -->
    <div class="tabcontent" id="T1">

    <ul class="shadetabs" id="countrytabs1">
    <li><a class="selected" href="#" rel="KI">Key Indicators</a></li>
    <li><a href="#" rel="DI">Database Information</a></li>
    </ul>

    <div style= "BORDER-RIGHT: gray 1px solid; PADDING-RIGHT: 10px; BORDER-TOP: gray 1px solid; PADDING-LEFT: 10px; MARGIN-BOTTOM: 1em; PADDING-BOTTOM: 10px; BORDER-LEFT: gray 1px solid; WIDTH: 95%; PADDING-TOP: 10px; BORDER-BOTTOM: gray 1px solid; HEIGHT: 950px">

    <div class="ctabcontent" id="KI">
    Tab content for Key Indicators here<br>
    Tab content for Key Indicators here<br>
    </div>

    <div class="ctabcontent" id="DI">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>
    </div>
    </div>

    <!-- DB Healthcheck Pack -->

    <div class="tabcontent" id="T2">

    <ul class="shadetabs" id="countrytabs2">
    <li><a class="selected" href="#" rel="Dh1">SQL Profiler</a></li>
    <li><a href="#" rel="Dh2">PlSql Optimizer</a></li>
    <li><a href="#" rel="Dh3">Statspack</a></li>
    <li><a href="#" rel="Dh4">Locks & Waits</a></li>
    <li><a href="#" rel="Dh5">Sessions</a></li>
    <li><a href="#" rel="Dh6">Security </a></li>
    <li><a href="#" rel="Dh7">Files</a></li>
    <li><a href="#" rel="Dh8">Object Browser</a></li>
    <li><a href="#" rel="Dh9">Tracing</a></li>
    <li><a href="#" rel="Dh10">Audit Trail</a></li>
    </ul>

    <div style= "BORDER-RIGHT: gray 1px solid; PADDING-RIGHT: 10px; BORDER-TOP: gray 1px solid; PADDING-LEFT: 10px; MARGIN-BOTTOM: 1em; PADDING-BOTTOM: 10px; BORDER-LEFT: gray 1px solid; WIDTH: 95%; PADDING-TOP: 10px; BORDER-BOTTOM: gray 1px solid; HEIGHT: 950px">

    <div class="ctabcontent" id="Dh1">
    Tab content for Key Indicators here<br>
    Tab content for Key Indicators here<br>
    </div>

    <div class="ctabcontent" id="Dh2">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>

    <div class="ctabcontent" id="Dh3">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>

    <div class="ctabcontent" id="Dh4">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>

    <div class="ctabcontent" id="Dh5">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>

    <div class="ctabcontent" id="Dh6">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>

    <div class="ctabcontent" id="Dh7">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>

    <div class="ctabcontent" id="Dh8">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>

    <div class="ctabcontent" id="Dh9">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>

    <div class="ctabcontent" id="Dh10">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>
    </div>
    </div>

    <!-- EBS Health Check -->

    <div class="tabcontent" id="T3">
    <ul class="shadetabs" id="countrytabs3">
    <li><a class="selected" href="#" rel="Eb1">EBS Dashboards</a></li>
    <li><a href="#" rel="Eb2">Modules</a></li>
    <li><a href="#" rel="Eb3">Concurrent Processing</a></li>
    <li><a href="#" rel="Eb4">Workflow Monitor</a></li>
    <li><a href="#" rel="Eb5">Patching</a></li>
    <li><a href="#" rel="Eb6">Change Management</a></li>
    <li><a href="#" rel="Eb7">Customizations & Extensions</a></li>
    </ul>

    <div style= "BORDER-RIGHT: gray 1px solid; PADDING-RIGHT: 10px; BORDER-TOP: gray 1px solid; PADDING-LEFT: 10px; MARGIN-BOTTOM: 1em; PADDING-BOTTOM: 10px; BORDER-LEFT: gray 1px solid; WIDTH: 95%; PADDING-TOP: 10px; BORDER-BOTTOM: gray 1px solid; HEIGHT: 950px">

    <div class="ctabcontent" id="Eb1">
    Tab content for Key Indicators here<br>
    Tab content for Key Indicators here<br>
    </div>

    <div class="ctabcontent" id="Eb2">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>

    <div class="ctabcontent" id="Eb3">
    Tab content for Key Indicators here<br>
    Tab content for Key Indicators here<br>
    </div>

    <div class="ctabcontent" id="Eb4">
    Tab content for Key Indicators here<br>
    Tab content for Key Indicators here<br>
    </div>

    <div class="ctabcontent" id="Eb5">
    Tab content for Key Indicators here<br>
    Tab content for Key Indicators here<br>
    </div>

    <div class="ctabcontent" id="Eb6">
    Tab content for Key Indicators here<br>
    Tab content for Key Indicators here<br>
    </div>

    <div class="ctabcontent" id="Eb7">
    Tab content for Key Indicators here<br>
    Tab content for Key Indicators here<br>
    </div>
    </div>
    </div>

    <!-- CPU Usage -->

    <div class="tabcontent" id="T4">
    Tab content 4 here<br>
    Tab content 4 here<br>
    </div>

    <!-- Middle Tier -->

    <div class="tabcontent" id="T5">
    <ul class="shadetabs" id="countrytabs1">
    <li><a class="selected" href="#" rel="Mt1">Web Servers</a></li>
    <li><a href="#" rel="Mt2">Transaction Performance</a></li>
    <li><a href="#" rel="Mt3">Page Performance</a></li>
    <li><a href="#" rel="Mt4">Components</a></li>
    </ul>

    <div style= "BORDER-RIGHT: gray 1px solid; PADDING-RIGHT: 10px; BORDER-TOP: gray 1px solid; PADDING-LEFT: 10px; MARGIN-BOTTOM: 1em; PADDING-BOTTOM: 10px; BORDER-LEFT: gray 1px solid; WIDTH: 95%; PADDING-TOP: 10px; BORDER-BOTTOM: gray 1px solid; HEIGHT: 950px">

    <div class="ctabcontent" id="Mt1">
    Tab content for Key Indicators here<br>
    Tab content for Key Indicators here<br>
    </div>

    <div class="ctabcontent" id="Mt2">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>

    <div class="ctabcontent" id="Mt3">
    Tab content for Key Indicators here<br>
    Tab content for Key Indicators here<br>
    </div>

    <div class="ctabcontent" id="Mt4">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>
    </div>
    </div>

    <!--Reports and Alerts -->

    <div class="tabcontent" id="T6">
    <ul class="shadetabs" id="countrytabs1">
    <li><a class="selected" href="#" rel="Ra1">Reports</a></li>
    <li><a href="#" rel="Ra2">Alerts</a></li>
    </ul>

    <div style= "BORDER-RIGHT: gray 1px solid; PADDING-RIGHT: 10px; BORDER-TOP: gray 1px solid; PADDING-LEFT: 10px; MARGIN-BOTTOM: 1em; PADDING-BOTTOM: 10px; BORDER-LEFT: gray 1px solid; WIDTH: 95%; PADDING-TOP: 10px; BORDER-BOTTOM: gray 1px solid; HEIGHT: 950px">

    <div class="ctabcontent" id="Ra1">
    Tab content for Key Indicators here<br>
    Tab content for Key Indicators here<br>
    </div>

    <div class="ctabcontent" id="Ra2">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>
    </div>
    </div>

    <div class="tabcontent" id="T7">
    Tab content 7 here<br>
    Tab content 7 here<br>
    </div>
    </div><script type="text/javascript">

    var countries=new ddtabcontent("countrytabs")
    countries.setpersist(true)
    countries.setselectedClassTarget("link") //"link" or "linkparent"
    countries.init()
    </script>
    </body>
    </html>

  • #4
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,854
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    Please reread my post. Thanks
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #5
    New Coder
    Join Date
    Dec 2008
    Posts
    23
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Hello

    I am sorry. Should I have posted something more? I did post entire code. Do you want CSS as well?

    Thanks
    Ruchir

  • #6
    New Coder
    Join Date
    Dec 2008
    Posts
    23
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I thought pasting CSS content might help demystifying the issue.

    /* ######### CSS for Shade Tabs. Remove if not using ######### */

    .shadetabs{
    padding: 3px 0;
    margin-left: 0;
    margin-top: 1px;
    margin-bottom: 0;
    font: bold 12px Verdana;
    list-style-type: none;
    text-align: left; /*set to left, center, or right to align the menu as desired*/
    }

    .shadetabs li{
    display: inline;
    margin: 0;
    }

    .shadetabs li a{
    text-decoration: none;
    position: relative;
    z-index: 1;
    padding: 3px 7px;
    margin-right: 3px;
    border: 1px solid #778;
    color: white;
    background: rgb(0,70,140);
    }

    .shadetabs li a:visited{
    background-color: rgb(255,169,83);
    color: rgb(0,70,140);
    }

    .shadetabs li a:hover{
    text-decoration: underline;
    background-color: rgb(234,234,234);
    color: rgb(0,70,140);
    }

    .shadetabs li a.selected{ /*selected main tab style */
    position: relative;
    top: 1px;
    background-color: rgb(255,169,83);
    color: rgb(0,70,140);
    }

    .shadetabs li a.selected{ /*selected main tab style */
    background-color: rgb(255,169,83);
    color: rgb(0,70,140);
    }

    .shadetabs li a.selected:hover{ /*selected main tab style */
    text-decoration: none;
    }

    // customization

    .shadetabsx{
    padding: 3px 0;
    margin-left: 0;
    margin-top: 1px;
    margin-bottom: 0;
    font: bold 12px Verdana;
    list-style-type: none;
    text-align: left; /*set to left, center, or right to align the menu as desired*/
    }

    .shadetabsx li{
    display: inline;
    margin: 0;
    }

    .shadetabsx li a{
    text-decoration: none;
    position: relative;
    z-index: 1;
    padding: 3px 7px;
    margin-right: 3px;
    border: 1px solid #778;
    color: white;
    background: rgb(0,70,140);
    }

    .shadetabsx li a:visited{
    background-color: rgb(255,169,83);
    color: rgb(0,70,140);
    }

    .shadetabsx li a:hover{
    text-decoration: underline;
    background-color: rgb(234,234,234);
    color: rgb(0,70,140);
    }

    .shadetabsx li a.selected{ /*selected main tab style */
    position: relative;
    top: 1px;
    }

    .shadetabsx li a.selected{ /*selected main tab style */
    border-color: rgb(0,70,140);
    }

    .shadetabsx li a.selected:hover{ /*selected main tab style */
    text-decoration: none;
    }

    .tabcontent{
    display:none;
    }

    .ctabcontent{
    display:block;
    }


    @media print {
    .tabcontent {
    display:block !important;
    }
    }

    @media print {
    .ctabcontent {
    display:block !important;
    }
    }

  • #7
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,854
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    [...]wrapped inside [CODE][/CODE] tags
    I mentioned about the above. (You may use the image on the editor's header to get this)
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #8
    New Coder
    Join Date
    Dec 2008
    Posts
    23
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Here you go

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

    <html>
    <head>
    <title>Coexsys EagleEye for Oracle</title>
    <meta content="Evrsoft First Page" name="GENERATOR"><!-- Javascript file and CSS file embedding for main tabls -->

    <script language="Javascript" src="tabcontent.js" type="text/javascript">
    </script>
    <link href="tabcontent.css" type="text/css" rel="stylesheet"><!-- Images and logs here -->
    </head>

    <body>
    <p dir="ltr" style="Design_Time_Lock: True"><img style="WIDTH: 291px; HEIGHT: 64px" height="64" src="file:///C:/WIDGET/home.jpg" width="340" border=
    "0">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&n bsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;& nbs p;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img style="WIDTH: 232px; HEIGHT: 62px"
    height="62" src="file:///C:/WIDGET/supprot.gif" width="299" border=
    "0">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&n bsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</p>

    <blockquote dir="ltr" style="MARGIN-RIGHT: 0px">
    <blockquote dir="ltr" style="MARGIN-RIGHT: 0px">
    <blockquote dir="ltr" style="MARGIN-RIGHT: 0px">
    <blockquote dir="ltr" style="MARGIN-RIGHT: 0px">
    <blockquote dir="ltr" style="MARGIN-RIGHT: 0px">
    <blockquote dir="ltr" style="MARGIN-RIGHT: 0px">
    <p>&nbsp;&nbsp;&nbsp;<img height="59" src="file:///C:/WIDGET/center.gif" width="198" border="0">&nbsp;&nbsp;&nbsp;&nbsp; <img height="54" src="file:///C:/WIDGET/left.gif" width="310"
    border="0"></p>
    </blockquote>
    </blockquote>
    </blockquote>
    </blockquote>
    </blockquote>
    </blockquote>

    <p dir="ltr">Saturday, 17, October, 2009 at 12:18:29 PM</p><!-- Table to display Oracle SID -->

    <table width="100%" bgcolor="#CCCCCC">
    <tbody>
    <tr>
    <td>
    <p dir="ltr" style="MARGIN-RIGHT: 0px" align="right">17/10/2009 at 12:34</p>
    </td>
    </tr>
    </tbody>
    </table>
    <!-- Main tabs HTML -->

    <ul class="shadetabs" id="countrytabs">
    <li><a class="selected" href="#" rel="T1">EagleEye Home</a></li>

    <li><a href="#" rel="T2">DB HealthCheck</a></li>

    <li><a href="#" rel="T3">EBS HealthCheck</a></li>

    <li><a href="#" rel="T4">CPU Usage</a></li>

    <li><a href="#" rel="T5">Middle Tier</a></li>

    <li><a href="#" rel="T6">Alerts &amp; Reports</a></li>

    <li><a href="#" rel="T7">Metalink</a></li>
    </ul>

    <div style=
    "BORDER-RIGHT: gray 1px solid; PADDING-RIGHT: 10px; BORDER-TOP: gray 1px solid; PADDING-LEFT: 10px; MARGIN-BOTTOM: 1em; PADDING-BOTTOM: 10px; BORDER-LEFT: gray 1px solid; WIDTH: 100%; PADDING-TOP: 10px; BORDER-BOTTOM: gray 1px solid; HEIGHT: 1000px">
    <!-- Home Page -->
    <div class="tabcontent" id="T1">

    <ul class="shadetabs" id="countrytabs1">
    <li><a class="selected" href="#" rel="KI">Key Indicators</a></li>
    <li><a href="#" rel="DI">Database Information</a></li>
    </ul>

    <div style= "BORDER-RIGHT: gray 1px solid; PADDING-RIGHT: 10px; BORDER-TOP: gray 1px solid; PADDING-LEFT: 10px; MARGIN-BOTTOM: 1em; PADDING-BOTTOM: 10px; BORDER-LEFT: gray 1px solid; WIDTH: 95%; PADDING-TOP: 10px; BORDER-BOTTOM: gray 1px solid; HEIGHT: 950px">

    <div class="ctabcontent" id="KI">
    Tab content for Key Indicators here<br>
    Tab content for Key Indicators here<br>
    </div>

    <div class="ctabcontent" id="DI">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>
    </div> </div>

    <!-- DB Healthcheck Pack -->

    <div class="tabcontent" id="T2">

    <ul class="shadetabs" id="countrytabs2">
    <li><a class="selected" href="#" rel="Dh1">SQL Profiler</a></li>
    <li><a href="#" rel="Dh2">PlSql Optimizer</a></li>
    <li><a href="#" rel="Dh3">Statspack</a></li>
    <li><a href="#" rel="Dh4">Locks & Waits</a></li>
    <li><a href="#" rel="Dh5">Sessions</a></li>
    <li><a href="#" rel="Dh6">Security </a></li>
    <li><a href="#" rel="Dh7">Files</a></li>
    <li><a href="#" rel="Dh8">Object Browser</a></li>
    <li><a href="#" rel="Dh9">Tracing</a></li>
    <li><a href="#" rel="Dh10">Audit Trail</a></li>
    </ul>

    <div style= "BORDER-RIGHT: gray 1px solid; PADDING-RIGHT: 10px; BORDER-TOP: gray 1px solid; PADDING-LEFT: 10px; MARGIN-BOTTOM: 1em; PADDING-BOTTOM: 10px; BORDER-LEFT: gray 1px solid; WIDTH: 95%; PADDING-TOP: 10px; BORDER-BOTTOM: gray 1px solid; HEIGHT: 950px">

    <div class="ctabcontent" id="Dh1">
    Tab content for Key Indicators here<br>
    Tab content for Key Indicators here<br>
    </div>

    <div class="ctabcontent" id="Dh2">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>

    <div class="ctabcontent" id="Dh3">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>

    <div class="ctabcontent" id="Dh4">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>

    <div class="ctabcontent" id="Dh5">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>

    <div class="ctabcontent" id="Dh6">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>

    <div class="ctabcontent" id="Dh7">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>

    <div class="ctabcontent" id="Dh8">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>

    <div class="ctabcontent" id="Dh9">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>

    <div class="ctabcontent" id="Dh10">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>
    </div>
    </div>

    <!-- EBS Health Check -->

    <div class="tabcontent" id="T3">
    <ul class="shadetabs" id="countrytabs3">
    <li><a class="selected" href="#" rel="Eb1">EBS Dashboards</a></li>
    <li><a href="#" rel="Eb2">Modules</a></li>
    <li><a href="#" rel="Eb3">Concurrent Processing</a></li>
    <li><a href="#" rel="Eb4">Workflow Monitor</a></li>
    <li><a href="#" rel="Eb5">Patching</a></li>
    <li><a href="#" rel="Eb6">Change Management</a></li>
    <li><a href="#" rel="Eb7">Customizations & Extensions</a></li>
    </ul>

    <div style= "BORDER-RIGHT: gray 1px solid; PADDING-RIGHT: 10px; BORDER-TOP: gray 1px solid; PADDING-LEFT: 10px; MARGIN-BOTTOM: 1em; PADDING-BOTTOM: 10px; BORDER-LEFT: gray 1px solid; WIDTH: 95%; PADDING-TOP: 10px; BORDER-BOTTOM: gray 1px solid; HEIGHT: 950px">

    <div class="ctabcontent" id="Eb1">
    Tab content for Key Indicators here<br>
    Tab content for Key Indicators here<br>
    </div>

    <div class="ctabcontent" id="Eb2">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>

    <div class="ctabcontent" id="Eb3">
    Tab content for Key Indicators here<br>
    Tab content for Key Indicators here<br>
    </div>

    <div class="ctabcontent" id="Eb4">
    Tab content for Key Indicators here<br>
    Tab content for Key Indicators here<br>
    </div>

    <div class="ctabcontent" id="Eb5">
    Tab content for Key Indicators here<br>
    Tab content for Key Indicators here<br>
    </div>

    <div class="ctabcontent" id="Eb6">
    Tab content for Key Indicators here<br>
    Tab content for Key Indicators here<br>
    </div>

    <div class="ctabcontent" id="Eb7">
    Tab content for Key Indicators here<br>
    Tab content for Key Indicators here<br>
    </div>
    </div>
    </div>

    <!-- CPU Usage -->

    <div class="tabcontent" id="T4">
    Tab content 4 here<br>
    Tab content 4 here<br>
    </div>

    <!-- Middle Tier -->

    <div class="tabcontent" id="T5">
    <ul class="shadetabs" id="countrytabs1">
    <li><a class="selected" href="#" rel="Mt1">Web Servers</a></li>
    <li><a href="#" rel="Mt2">Transaction Performance</a></li>
    <li><a href="#" rel="Mt3">Page Performance</a></li>
    <li><a href="#" rel="Mt4">Components</a></li>
    </ul>

    <div style= "BORDER-RIGHT: gray 1px solid; PADDING-RIGHT: 10px; BORDER-TOP: gray 1px solid; PADDING-LEFT: 10px; MARGIN-BOTTOM: 1em; PADDING-BOTTOM: 10px; BORDER-LEFT: gray 1px solid; WIDTH: 95%; PADDING-TOP: 10px; BORDER-BOTTOM: gray 1px solid; HEIGHT: 950px">

    <div class="ctabcontent" id="Mt1">
    Tab content for Key Indicators here<br>
    Tab content for Key Indicators here<br>
    </div>

    <div class="ctabcontent" id="Mt2">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>

    <div class="ctabcontent" id="Mt3">
    Tab content for Key Indicators here<br>
    Tab content for Key Indicators here<br>
    </div>

    <div class="ctabcontent" id="Mt4">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>
    </div>
    </div>

    <!--Reports and Alerts -->

    <div class="tabcontent" id="T6">
    <ul class="shadetabs" id="countrytabs1">
    <li><a class="selected" href="#" rel="Ra1">Reports</a></li>
    <li><a href="#" rel="Ra2">Alerts</a></li>
    </ul>

    <div style= "BORDER-RIGHT: gray 1px solid; PADDING-RIGHT: 10px; BORDER-TOP: gray 1px solid; PADDING-LEFT: 10px; MARGIN-BOTTOM: 1em; PADDING-BOTTOM: 10px; BORDER-LEFT: gray 1px solid; WIDTH: 95%; PADDING-TOP: 10px; BORDER-BOTTOM: gray 1px solid; HEIGHT: 950px">

    <div class="ctabcontent" id="Ra1">
    Tab content for Key Indicators here<br>
    Tab content for Key Indicators here<br>
    </div>

    <div class="ctabcontent" id="Ra2">
    Tab content for Database Information here<br>
    Tab content for Database Information here<br>
    </div>
    </div>
    </div>

    <div class="tabcontent" id="T7">
    Tab content 7 here<br>
    Tab content 7 here<br>
    </div>
    </div><script type="text/javascript">

    var countries=new ddtabcontent("countrytabs")
    countries.setpersist(true)
    countries.setselectedClassTarget("link") //"link" or "linkparent"
    countries.init()
    </script>
    </body>
    </html>


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •