How do I links TABS to an IFRAME ?

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts
  • Rob (SA)
    Lieutenant Colonel

    • Nov 2006
    • 586

    How do I links TABS to an IFRAME ?

    Hi Folks,

    I am trying to do something like this but without the major scripts and effort in changing values consisitantly.

    www.gnjgf.co.za/gngucal.html

    How do I link a tab menu with one singular Iframe that when I click on the month I see the result of the click in the iframe
    Kind Regards
    Rob
    www.gnjgf.co.za
    www.oryan-projects.com
  • Collectors-info
    General

    • Feb 2006
    • 8703

    #2
    Re: How do I links TABS to an IFRAME ?

    Hi , i believe you named your iframe "tabiframe" If so! When you link from the tab FEB, type in the url you want to appear in the frame & also type tabiframe in the target field. The pages you want to appear in the frame must be published.
    Regards Chris.

    Collectables, Collecting, collectors-info.com

    www.chrismorris.co.uk

    House build project

    Comment

    • Rob (SA)
      Lieutenant Colonel

      • Nov 2006
      • 586

      #3
      Re: How do I links TABS to an IFRAME ?

      Hi Chris,

      Thanks for that help - quick and easy.

      Now for the tricky part.

      How does a person increase / chnage the spacing between the tabs?
      Kind Regards
      Rob
      www.gnjgf.co.za
      www.oryan-projects.com

      Comment

      • Collectors-info
        General

        • Feb 2006
        • 8703

        #4
        Re: How do I links TABS to an IFRAME ?

        Hi, you will need to play around with the css part than you placed in the head of the page.
        Try increasing the margin number to (lets say) 8 & see how that changes the looks. Make the changes 1 at a time & play with the ones on blue as well.

        </style>
        <style type="text/css">
        #TabMenu1
        {
        float: left;
        width: 100%;
        font-family: Arial;
        font-size: 11px;
        line-height: normal;
        }
        #TabMenu1 ul
        {
        margin: 8;
        padding: 10px 0px 3px 10px;
        list-style: none;
        }
        #TabMenu1 li
        {
        display: inline;
        margin: 0;
        padding: 0;
        }
        #TabMenu1 a
        {
        float: left;
        background: url("style13left.gif") no-repeat left top;
        margin: 0;
        padding: 0 0 0 4px;
        text-decoration: none;
        }
        #TabMenu1 a span
        {
        float: none;
        display: block;
        background: url("style13right.gif") no-repeat right top;
        padding: 5px 15px 4px 6px;
        color: #627EB7;
        font-weight: bold;
        text-decoration: none;
        }
        #TabMenu1 a:hover span
        {
        background-position: 100% -42px;
        color: #FF0000;
        font-weight: bold;
        font-style: normal;
        text-decoration: none;
        }
        #TabMenu1 a:hover
        {
        background-position: 0% -42px;
        }
        #TabMenu1 #active a
        {
        background-position: 0% -84px;
        }
        #TabMenu1 #active a span
        {
        background-position: 100% -84px;
        color: #627EB7;
        font-weight: bold;
        text-decoration: none;
        }
        </style>
        Regards Chris.

        Collectables, Collecting, collectors-info.com

        www.chrismorris.co.uk

        House build project

        Comment

        Working...
        X