Javascript question (making navigation/side bar)

Jump to First Reply
Posted:
in Genius Bar edited January 2014
Im curious as to how get like a side bar or column on the left hand side of the page to list like the different sections of a website in Javascript with tabular design. Like the header and stuff is easy to do in HTML but I dont know how to create the sideburn.



Any help would be greatly appreciated.

Comments

  • Reply 1 of 4
    up
     0Likes 0Dislikes 0Informatives
  • Reply 2 of 4
    der kopfder kopf Posts: 2,275member
    Why would that have to be Javascript and tabular design exactly?



    (also, current conventions disfavour the use of table for simple layout, but ala, do as you please).



    What you want, or at least what I understand that you want, is most often accomplished by the use of frames. I think if you're relatively new to HTML or whatever, that you should check out <a href="http://www.w3c.org"; target="_blank">w3c</a> and their HTML reference (they are the regulatory organ, so what they say is the law, when it comes to HTML at least). There, you will find that frames are like placeholders. They are a special kind of HTML document that actually exists of two or more other HTML documents.



    An example, from the reference I'm talking about:



    [code] &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"

    "http://www.w3.org/TR/html4/frameset.dtd"&gt;

    &lt;HTML&gt;

    &lt;HEAD&gt;

    &lt;TITLE&gt;A simple frameset document&lt;/TITLE&gt;

    &lt;/HEAD&gt;

    &lt;FRAMESET cols="20%, 80%"&gt;

    &lt;FRAMESET rows="100, 200"&gt;

    &lt;FRAME src="contents_of_frame1.html"&gt;

    &lt;FRAME src="contents_of_frame2.gif"&gt;

    &lt;/FRAMESET&gt;

    &lt;FRAME src="contents_of_frame3.html"&gt;

    &lt;NOFRAMES&gt;

    &lt;P&gt;This frameset document contains:

    &lt;UL&gt;

    &lt;LI&gt;&lt;A href="contents_of_frame1.html"&gt;Some neat contents&lt;/A&gt;

    &lt;LI&gt;&lt;IMG src="contents_of_frame2.gif" alt="A neat image"&gt;

    &lt;LI&gt;&lt;A href="contents_of_frame3.html"&gt;Some other neat contents&lt;/A&gt;

    &lt;/UL&gt;

    &lt;/NOFRAMES&gt;

    &lt;/FRAMESET&gt;

    &lt;/HTML&gt; </pre><hr></blockquote>



    Where you should especially notice

    [code] &lt;FRAME src="contents_of_frame1.html"&gt;

    &lt;FRAME src="contents_of_frame2.gif"&gt; </pre><hr></blockquote>



    for these things hold the different 'sections', 'frames' of your page. Now if you say want a left section, you would need a frameset consisting of two COLUMNS. The above example is a nested frameset already, which isn't so hard, but still. So you would need like:



    [code] &lt;FRAMESET cols="30%, 70%"&gt;

    &lt;FRAME src="contents_of_frame1.html"&gt;

    &lt;FRAME src="contents_of_frame2.gif"&gt;

    &lt;/FRAMESET&gt; </pre><hr></blockquote>



    in which 'contents_of_frame1.html' would be the left section you covet.



    Also, I suggest you have a quick skim through that reference, it will explain the use the NOFRAMES tag, and it will explain why there are no BODY tags.



    I hope this is what you were looking for.
     0Likes 0Dislikes 0Informatives
  • Reply 3 of 4
    der kopfder kopf Posts: 2,275member
    I forget: to make it so that any link clicked in the left frame will load your page in the right frame, you'll have to add:



    1) a target attribute in the left frame's tag

    2) a name attribute in the rigth frame's tag



    e.g.



    [code]&lt;FRAME src="left.html" target="right"&gt;

    &lt;FRAME src="right.html" name="right"&gt;</pre><hr></blockquote>
     0Likes 0Dislikes 0Informatives
  • Reply 4 of 4
    Thanks a lot for that. I also found some slightly different ways to do it, so I'm set for that.



    One more question. How do I create a Javascript object, property, or method that is specific to a browser like IE or Netscape (since those are the 2 main ones and I will be using them)???
     0Likes 0Dislikes 0Informatives
Sign In or Register to comment.