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.
Page 1 of 2 12 LastLast
Results 1 to 15 of 20

Thread: HELP w/ FRAMES

  1. #1
    New to the CF scene
    Join Date
    Jun 2002
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question HELP w/ FRAMES

    ok, here's my site: Welcome to CTImports.com (I realize the URL is CTImports.net but we're buying the .com domain name soon)

    Here's my problem:

    I had this layout template made for my company and I've come across some problems. I need to have a frame built in the middle (where I drew the red square) and I need a background image (where I drew the green square). Someone give me a solution ASAP, PLEASE! Thank you

    Last edited by CTImports; 06-18-2002 at 12:25 AM.

  • #2
    Regular Coder
    Join Date
    Jun 2002
    Location
    Auckland New Zealand
    Posts
    115
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Do you mean setting up the page with three frames plus the one across the top?


    If you want that (above) this would be your basic layout....


    <html>

    <head>
    <meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
    <title>frames</title>
    </head>

    <frameset rows="101,*" border="0" framespacing="0">
    <frame src="TOP STUFF HERE " name="top" noresize scrolling="no">
    <frameset cols="80,*,80" border="0" framespacing="0">
    <frame src="menu stuff here.htm" name="left" noresize scrolling="no">
    <frame src="main stuff goes here.htm" name="No Name" noresize>
    <frame src="green section stuff.htm" name="green section" noresize>
    </frameset>
    </frameset>
    <noframes>

    <body bgcolor="#ffffff">
    </body>

    </noframes>

    </html>

    The hard part though is that you would then need to slice your images to fit into each of the frames, the left frame would have to be an absolute width and height to ensure that the sliced image does not "move" on higher res. screens

    I have drawn hoe the frames would need to be set out, which also shows how to slice the images...



    Hope this helps, heaps of work to get the result you want.



    Tonz
    Attached Thumbnails Attached Thumbnails HELP w/ FRAMES-ctiphotoshop.jpg  
    Beware, the Cybertooth tiger cometh

  • #3
    Senior Coder
    Join Date
    Jun 2002
    Location
    The Netherlands, Baarn, Ut.
    Posts
    4,252
    Thanks
    0
    Thanked 0 Times in 0 Posts
    If he actually needs a frame like the red box he drew he'll need a least five frames, one more for the footer as well...
    Regards,
    Ronald.
    ronaldvanderwijden.com

  • #4
    Regular Coder
    Join Date
    Jun 2002
    Posts
    344
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Why not use an IFrame??

    You can set the specific width/height of it and it'll work just fine.

    IFrame is supported by the latest HTML specification - and works fine in IE5+ and NS6+

    For the netscape 4 users, there's the ILayer tag - works the same as IFrame... here's an example

    <iframe src="your_html_file" frameborder="0" width="500" height="500"></iframe>

    That's it...

    ~Quack

  • #5
    Regular Coder
    Join Date
    Jun 2002
    Posts
    344
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Oh yeah, by the way... CTImports - I love the design, it looks amazing!!!!



    ~Quack

  • #6
    Regular Coder
    Join Date
    Jun 2002
    Location
    Auckland New Zealand
    Posts
    115
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Originally posted by ronaldb66
    If he actually needs a frame like the red box he drew he'll need a least five frames, one more for the footer as well...
    Well spotted.....

    .......absolutly right.

    Tonz

    PS I do like the design also... very sharp!
    Beware, the Cybertooth tiger cometh

  • #7
    Regular Coder
    Join Date
    Jun 2002
    Posts
    344
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I'll still stick to my suggestion - use an IFrame...

    if you need help with that, just ask...

    ~Quack

  • #8
    New to the CF scene
    Join Date
    Jun 2002
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Well, I converted it to PHP format and sort of got what I wanted but I still think iFrame would be better. Right now, the page just stretches down to the length of the text and images. But I would much rather have a frame in itself in the middle of the page with its own scroll-bar, like this:



    Here is how the page is setup now:

    Welcome to CTImports.com

    I don't mean to be picky, but I think an iFrame in the middle of the page would look much professional than having the whole page just stretch down.

    QuackHead, if you would, PLEASE help me achieve this.. I need the site up and running by this weekend

  • #9
    New to the CF scene
    Join Date
    Jun 2002
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    btw, thanx for the props everyone

  • #10
    Regular Coder
    Join Date
    Jun 2002
    Location
    England =)
    Posts
    523
    Thanks
    26
    Thanked 0 Times in 0 Posts
    remember IFrames arent supported by all browsers... hence the fact not many pros use them...

    u could always use SSI (slow as not cachable) or javascript (fast but a pain to update)

    using javascript u can just document.write all the stuff... i use them for menus as we dont have asp or php on our server here
    "They hired me for my motivational skills. Everyone at work says they have to work much harder when I`m around" Homer J Simpson

  • #11
    Senior Coder
    Join Date
    Jun 2002
    Location
    The Netherlands, Baarn, Ut.
    Posts
    4,252
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Well, go for the original proposal then:

    use two framesets, one outer, one inner;
    have the outer frameset contain three rows:
    first row = header,
    second row = inner frameset,
    third row = footer;
    have the inner frameset contain three columns:
    first column = menu bar,
    second column = "The Red Square",
    third column = whatever's-right-of-it.

    This way, you can assure the page to fit the window at all times, and the contents of The Red Square to scroll when necessary.
    Do take note of the drawbacks of frames, though.
    Regards,
    Ronald.
    ronaldvanderwijden.com

  • #12
    Regular Coder
    Join Date
    Jun 2002
    Location
    England =)
    Posts
    523
    Thanks
    26
    Thanked 0 Times in 0 Posts
    the problem i find is that netscape 4 doesnt render frames accurately tho and for this type of design u need pixel precision (to get the gradient elipse segment lined up)

    when u resize NS frames they are always different - just the sucky rendering - although if u arent supporting NS4 then u would be ok...

    another thing tho, how is this site gonna look in 800x600 - a lot of partially sighted ppl (the ones who use such low res ) will prolly use this site as they still (unfortunately) make up the majority of web surfers..

    imho with frames they arent gonna get much viewable area are they?
    "They hired me for my motivational skills. Everyone at work says they have to work much harder when I`m around" Homer J Simpson

  • #13
    Regular Coder
    Join Date
    Jun 2002
    Posts
    344
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I agree - the idea of using 5 different frames for that site pains me - and I'm not even the one making the site!

    babelfish: You make an important comment no the IFrame capabilities - I'm running into a few problems with them myself... (I hate netscape!!!! )

    CTImports: You said you're using PHP right?

    ~Quack

  • #14
    Regular Coder
    Join Date
    Jun 2002
    Posts
    344
    Thanks
    0
    Thanked 0 Times in 0 Posts
    CTImports:

    I've modified your HTML file - here's a few things I did for you...

    • added IFrame/ILayer (ILayer is in there to be compatible with Netscape 4) It's clearly commented for you to add your information - the frame border will dissapear when you have a real page in there...
    • changed scrollbar colours (I left the old stuff there if you want to use it) - I made it look a little more pretty (IMO)
    • Set the width/height of the IFrame to fill up most of the space there - you can change it around a little if you want, but I set the width to 427, and the height to 390 (which seems to take up most of the space...)


    Let me know if this is ok, and if you need help with anything else...

    ~Quack

  • #15
    Regular Coder
    Join Date
    Jun 2002
    Posts
    344
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Here's your HTML code now... the code you need is in red
    Code:
    
    <HTML><HEAD><TITLE>Welcome to CTImports.com</TITLE>
    <META content="insert your site description here" name=description>
    <META content="enter your keywords here" name=keywords>
    <META http-equiv=Content-Type content="text/html; charset=iso-8859-1">
    <STYLE type=text/css>
    	BODY {PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; scrollbar-base-color: #0076E6; scrollbar-arrow-color: #FFFFFF;}
    	A:link {COLOR: #005ca2; TEXT-DECORATION: none;}
    	A:visited {COLOR: #005ca2; TEXT-DECORATION: none;}
    	A:active {COLOR: #0099ff; TEXT-DECORATION: underline;}
    	A:hover {COLOR: #0099ff; TEXT-DECORATION: underline;}
    </STYLE>
    
    <!-- You old scrollbar stuff...
    <STYLE>
    	BODY {SCROLLBAR-FACE-COLOR: #0076e6; SCROLLBAR-ARROW-COLOR: #ffffff; SCROLLBAR-TRACK-COLOR: #ffffff;}
    </STYLE>
    -->
    
    <LINK href="file:///E|/all%20web_file/job_cd6/fsct/webeng/textstyle" 
    type=text/css rel=stylesheet><LINK href="textstyle.css" type=text/css 
    rel=stylesheet>
    <META content="MSHTML 6.00.2600.0" name=GENERATOR></HEAD>
    <BODY bgColor=#ffffff background=images/space.gif><IMG 
    src="images/top_menu.gif" border=0><BR>
    <TABLE cellSpacing=0 cellPadding=0 width=780 bgColor=#ffffff>
      <TBODY>
      <TR>
        <TD width=241><IMG src="images/top_menu2.gif" border=0></TD>
        <TD width=539 background=images/marquee.gif>
          <MARQUEE><FONT face=verdana color=#ffffff size=2><B>Welcome to Chaos 
          Theory Imports!</B></FONT></MARQUEE></TD></TR></TBODY></TABLE>
    <TABLE cellSpacing=0 cellPadding=0 width=780 bgColor=#ffffff>
      <TBODY>
      <TR vAlign=top>
        <TD align=middle width=150 background=images/space.gif><IMG 
          src="images/top_menu3.gif" border=0><BR><IMG src="images/menu.gif" 
          border=0></TD>
        <TD width=427>
          <TABLE cellSpacing=0 cellPadding=0 width=427 bgColor=#ffffff>
            <TBODY>
            <TR vAlign=top>
              <TD width=72><IMG src="images/corner_page.gif"></TD>
              <TD align=middle width=355>&nbsp;</TD></TR>
            <TR vAlign=top>
              <TD align=middle width=427 colSpan=2>
    
    			<!-- this is the stuff you need -->
    				<iframe src="your_html_file.htm" width="427" height="390" frameborder="0" topmargin="0" marginheight="0" leftmargin="1" marginwidth="1"></iframe>
    				<!--ILAYER FOR Netscape 4-->
    				<ilayer src="your_html_file.htm" width="427" height="390" border="0" topmargin="0" marginheight="0" leftmargin="1" marginwidth="1"></ilayer>
    				<!--End ILayer-->
    			<!-- end here -->
    
    		  </TD></TR></TBODY></TABLE></TD>
        <TD align=middle width=203 background=images/corner_bg.gif>
          <TABLE height="100%" cellSpacing=0 cellPadding=0 width=202 border=0>
            <TBODY>
            <TR>
              <TD vAlign=top align=left width=13 height=32><IMG height=9 
                src="images/corner.gif" width=13></TD>
              <TD width=190 height=32><IMG height=32 src="images/info_top.gif" 
                width=190></TD></TR>
            <TR>
              <TD width=13></TD>
              <TD vAlign=top align=left height=100>
                <TABLE height="100%" cellSpacing=0 cellPadding=0 width="100%" 
                background=images/info_bg.gif border=0>
                  <TBODY>
                  <TR>
                    <TD vAlign=top align=left>
                      <TABLE class=txt1 cellSpacing=0 cellPadding=0 width="100%" 
                      border=0>
                        <TBODY>
                        <TR>
                          <TD width=10>&nbsp;</TD>
                          <TD><FONT face=verdana size=1>• Update 1 is located 
                            here<BR>• Update 2 is located here<BR>• Update 3 is 
                            located here<BR>• Update 4 is located here<BR>• Update 5 
                            is located here </FONT></TD>
                          <TD width=20>&nbsp;</TD></TR></TBODY></TABLE></TD></TR>
                  <TR>
                    <TD vAlign=bottom align=right height=15><A 
                      href="http://www.ctimports.net/index2.php#"><IMG height=11 
                      src="images/info_title.gif" width=59 border=0></A><IMG 
                      height=1 src="" width=15></TD></TR></TBODY></TABLE></TD></TR>
            <TR>
              <TD width=13 height=7></TD>
              <TD width=180 height=7><IMG height=7 src="images/info_bottom.gif" 
                width=180></TD></TR>
            <TR>
              <TD width=13>&nbsp;</TD>
              <TD>&nbsp;</TD></TR></TBODY></TABLE></TD></TR>
      <TR vAlign=top>
        <TD align=middle width=150 background=images/menu_bg.gif>&nbsp;</TD>
        <TD align=middle width=427><FONT face=verdana size=1><A 
          href="http://www.ctimports.net/index2.php#">Home</A> | <A 
          href="http://www.ctimports.net/index2.php#">Chapters</A> | <A 
          href="http://www.ctimports.net/index2.php#">Interaction</A> | <A 
          href="http://www.ctimports.net/index2.php#">About Us</A> | <A 
          href="http://www.ctimports.net/index2.php#">Contact Us</A> <BR>Copyright © 
          2002 Chaos Theory Imports. All Rights Reserved. </FONT></TD>
        <TD align=middle width=203 background=images/corner_bg.gif>&nbsp;</TD></TR>
      <TR vAlign=top>
        <TD align=middle width=150 background=images/menu_bg2.gif>&nbsp;</TD>
        <TD width=427 bgColor=#0076e6>&nbsp;</TD>
        <TD width=203 bgColor=#0076e6>&nbsp;</TD></TR></TBODY></TABLE></BODY></HTML>
    
    BTW - Your HTML is formatted TERRIBLY!!!!!! What do you use to make your stuff?

    ~Quack
    Last edited by QuackHead; 06-19-2002 at 04:41 PM.


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

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