Tutorial on Frames...

  • Cheez00
  • Newbie
  • Newbie
  • User avatar
  • Posts: 7
  • Loc: Lodi, CA

Post 3+ Months Ago

hey guys, im just learning html, and i want to start with dreamweaver, i ahve the program, and this is what im trying to do

create a basic flash menu, on the top, then have the bottom 80% be in another frame, and change when you click a button. so only the bottom part changes, and i dont watn there to be any border or anything showing the frame... thanks alot
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • UNFLUX
  • Genius
  • Genius
  • User avatar
  • Posts: 6376
  • Loc: twitter.com/unflux

Post 3+ Months Ago

frames are easier than they're given credit for.

is this what you want to do?
http://www.cloud9studios.com/9.htm
  • Cheez00
  • Newbie
  • Newbie
  • User avatar
  • Posts: 7
  • Loc: Lodi, CA

Post 3+ Months Ago

exactly what i want!
  • UNFLUX
  • Genius
  • Genius
  • User avatar
  • Posts: 6376
  • Loc: twitter.com/unflux

Post 3+ Months Ago

basically, make your frames page and fix the top portion to the height of
the flash header. so if the flash header is 200px, then fix the top frame
to that size. Here's a sample code for that:
Code: [ Select ]
<html>

<head>
<title>Site Title</title>
</head>

<frameset rows="200,*" framespacing="0" border="0" frameborder="0">
 <frame name="header" scrolling="no" noresize target="main" src="header.htm" marginwidth="0" marginheight="0">
 <frame name="contents" src="bottom.htm" marginwidth="0" marginheight="0" scrolling="no" noresize target="_self">
 <noframes>
 <body topmargin="0" leftmargin="0">

 <p>This page uses frames, but your browser doesn't support them.</p>

 </body>
 </noframes>
</frameset>

</html>
  1. <html>
  2. <head>
  3. <title>Site Title</title>
  4. </head>
  5. <frameset rows="200,*" framespacing="0" border="0" frameborder="0">
  6.  <frame name="header" scrolling="no" noresize target="main" src="header.htm" marginwidth="0" marginheight="0">
  7.  <frame name="contents" src="bottom.htm" marginwidth="0" marginheight="0" scrolling="no" noresize target="_self">
  8.  <noframes>
  9.  <body topmargin="0" leftmargin="0">
  10.  <p>This page uses frames, but your browser doesn't support them.</p>
  11.  </body>
  12.  </noframes>
  13. </frameset>
  14. </html>

Once you've gotten the basic frames in, you can make your regular
pages. the header would obviously only contain the flash movie. The
bottom.htm would of course have the rest of your site as you see fit for
the design.

Now the part that makes it all work is in the buttons within your flash
movie. On each button, make sure this is on:
Code: [ Select ]
on (release) {
    getURL("nextpage.htm", "content");
}
  1. on (release) {
  2.     getURL("nextpage.htm", "content");
  3. }

You can see the target is pointing to the name of the bottom frame,
which is "content." this tells the link which page to change.

make sense? :wink:
  • Cheez00
  • Newbie
  • Newbie
  • User avatar
  • Posts: 7
  • Loc: Lodi, CA

Post 3+ Months Ago

it doenst work right... i copied the code and it gives me a very small border, its gay, lol i want it just so you cant see it, but its a frame, also i really want a tutorial on how to do it in dreamweaver
  • UNFLUX
  • Genius
  • Genius
  • User avatar
  • Posts: 6376
  • Loc: twitter.com/unflux

Post 3+ Months Ago

ok, well i built that site in dreamweaver, and that's the code it wrote
verbatum. Not sure why you would get any borders, it's literally a copy
and paste of the site example I showed you. :?

anyway - i know dreamweaver has excellent tutorials and help files. I
would recommend you start there then.
  • Steen
  • Proficient
  • Proficient
  • User avatar
  • Posts: 343

Post 3+ Months Ago


http://www.w3schools.com/html/html_frames.asp


also,
name the frames so they can be targeted easier.
(for when you want to pop back to a specific frame,
this is usually handy for when you have openend a new console
and want a link to change some page in the original frameset.)

Code: [ Select ]
<script language="javascript">
<!--
        self.name = "this_console";
// -->
</script>
  1. <script language="javascript">
  2. <!--
  3.         self.name = "this_console";
  4. // -->
  5. </script>



.... not sure it thats handy for you or not.

Post Information

  • Total Posts in this topic: 7 posts
  • Users browsing this forum: No registered users and 44 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.