Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 4 of 4

Thread: div tag help

  1. #1
    Junior Member
    Join Date
    Jan 2006
    Posts
    1
    Member #
    12249
    Hi, im making a basic site with div tags. I currently have 7 div tags on the main page, a large one at the top with a jpg in it, 5 menu div tags down the left side each with their own little jpg inside, and finally, a large div tag which I intend to be my body. I am having extreme trouble finding out how to make it so that if you click on one of the menu div tags on the left, it will open content in the body div tag. How do i do this? I've spent hours googling this and found nothing, absolutely zero, on this topic. Any help is appreciated! Thanks, Generic

  2.  

  3. #2
    Senior Member karinne's Avatar
    Join Date
    Dec 2003
    Location
    Aylmer QC Canada
    Posts
    1,607
    Member #
    4335
    Liked
    8 times
    Frames or Iframes would do that for ya.
    [a web design portfolio - Currently NOT AVAILABLE for work | web design | Re-coding | PSD-to-HTML]
    I'm also on: virb - facebook - twitter - flickr - del.icio.us

  4. #3
    Junior Member
    Join Date
    Jan 2004
    Posts
    12
    Member #
    4443
    Here is my suggestion... take in mind if you have alot of content you may just want to do separate pages.


    Inside your main DIV you create 5 separate divs, each one containing the information you want to display.

    Lets just say ABOUT/CONTACT/PORTFOLIO/LINKS/MEDIA

    So you would then have 5 separate divs inside your main div, I would assign them names such as
    Code:
    <div id="about">
    <div id="contact">
    <div id="portfolio">
    <div id="links">
    <div id="media">

    Now in your stylesheet, assign all of these with a display: none;
    *note: you can leave whatever one you want to default show out of this*

    Then you create a javascript function, such as
    Code:
    <script type="text/javascript">
    var loc;
    function showDiv(loc) {
      if(loc == "about")
      document.getElementById("about").style.display = "block";
      document.getElementById("contact").style.display = "none";
      document.getElementById("portfolio").style.display = "none";
      document.getElementById("links").style.display = "none";
      document.getElementById("media").style.display = "none";
      }else if(loc == "contact") {
      document.getElementById("about").style.display = "none";
      document.getElementById("contact").style.display = "block";
      document.getElementById("portfolio").style.display = "none";
      document.getElementById("links").style.display = "none";
      document.getElementById("media").style.display = "none";
     }else if(loc == "porfolio") {
      document.getElementById("about").style.display = "none";
      document.getElementById("contact").style.display = "none";
      document.getElementById("portfolio").style.display = "block";
      document.getElementById("links").style.display = "none";
      document.getElementById("media").style.display = "none";
     }else if(loc == "links") {
      document.getElementById("about").style.display = "none";
      document.getElementById("contact").style.display = "none";
      document.getElementById("portfolio").style.display = "none";
      document.getElementById("links").style.display = "block";
      document.getElementById("media").style.display = "none";
     }else if(loc == "media") {
      document.getElementById("about").style.display = "none";
      document.getElementById("contact").style.display = "none";
      document.getElementById("portfolio").style.display = "none";
      document.getElementById("links").style.display = "none";
      document.getElementById("media").style.display = "block";
     }
    }
    Then in your navigation section simply call that function on your hyperlink.
    Code:
    <a href="javascript: showDiv('about');" title="About Us">About Us</a>
    Its all off the top of my head but the logic works.

    -Brett




    </script>

  5. #4
    Junior Member
    Join Date
    Oct 2009
    Posts
    1
    Member #
    20275
    I know this is an old post, but I was wondering if this had worked. I tried but I am a newbie and have many questions. Any more help you can offer?

    thank you!


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 03:38 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com