Web Design Forums

FreakStyley · 08-05-2005, 15:32

Hi all,

I've been working on my website and trying to make it load as fast as possible. I'm using dreamweaver and the design side has gone ok.

I'm an artist and want to load pages into a "gallery" area in the middle of the viewing area. at present I'm using an iframe. is this the best way to go about it? also the iframe doesn't show in IE, only in mozilla firefox.

here is the code I'm using (loading the *called* page into a table):

<IFRAME name=Content align=center src="content/content_1.htm" frameBorder=0 width="100%" height=100%></IFRAME>

is there something else I can do to make it run faster....the page thats loaded (although just text) takes the longest to load....the Iframe content (text) also takes quite a while to load locally.

Thanks in advance,

- FreakStyley

Cborrow · 08-05-2005, 16:31

Just use a <p> tag, and the overflow: auto; attribute in your css so something like this.

Code:

<html>
<head>
<title>What ever</title>
<style type="text/css"><!--
#content {
color: #000000;
font-family: Verdana, Arial;
font-size: 8pt;
overflow: auto;
}
--></style>
</head>

<body>
<div id="content">
<p>Your content goes here</p>
</div>
</body>
</html>

There that way you can have your scrollbars and such, and have all your content on one page so you don't have to load up a bunch of other pages that are in Iframes also.

-Cory

roto · 08-05-2005, 18:27

Isn't it better to us a <div> for your content?

FreakStyley · 08-05-2005, 20:12

Cborrow: that doesn't really apply to what I need as I have a graphics heavy gallery with 6 different categories. all linking from the menu on the right. I need that different content appears in the middle "content" section with a single click on the right menu.

So far, like I said, I'm using the iframe and its loading basic enough...but very slow (even locally).....is there be any other way (I'm using DreamWeaver 7.0)??

Roto: can you explain a basic "page load" idea with the <div> tag? (I'm 90% designer, 10% god only knows)

Cborrow · 08-05-2005, 21:06

Quote:

Originally Posted by ®oto

Isn't it better to us a <div> for your content?

Lol, yeah I knew that I forgot something in that.

pgo · 08-05-2005, 21:30

With the CSS overflow property you don't need frames of any type - at all. That's why the W3C deprecated frames.

Try doing this - setting up a <div> for each column, and for whichever column you want to scroll, set overflow to auto.

I think. I've personally never used the pseudo-frames technique because I find it obnoxious.

emil · 09-05-2005, 04:00

iframes are bad for seo puropses, but if you don't care about google, and are concerned about loading speed just go ahead.
if you just want the iframe "feel" use a scrollable div.

It's very strange that the iframe does not show in IE, could you post a link?

FreakStyley · 11-05-2005, 10:23

hi thanks for the reply guys.

@emilpaun: I gave up on the iframe idea. everyone seems to like the div better. ya learn something new everyday

ok, so its better to have everything on the one page? I know the images will cache. I've got dial-up and every page click seems to reload the same images (they're all 12kb or less, which is nothing)?

the <div> idea is good! (thanks) I never thought about that (I'm self taught...doesn't it show! haha) I always assumed it would be better if the pages loaded INTO the areas needed. hell, one page suits me for the coding issues alone.

ok so here is the problem....I'm trying to confine the <div> to a certain layout on my page. VERY similar actually to the typical "post reply" in forums...just the VISUAL aspect of it when we are typing a LONG reply (like this one)

the important thing i need is to make it (#2) stop hard at the bottom (V), but stretch with the browser (W). do I need another div element?
at the moment it just keeps scrolling down the screen (its driving me nuts! I HATE the way in which I can't define its borders (I wish dreamweaver was more like photoshop! WYSIWY*REALLY*G)

other question: how can I make the page go 100% vertical with the browser for people with large monitors? (I'm designing it for 1024x768 and up) thats why I tried frames in the first place. one at the bottom at least.

help please!!!!

Brown · 11-05-2005, 10:31

give the content you want to scroll a fixed height. then add overflow properties. as below.

#div-main {
background-color: #CCCC99;
margin: 10px;
border: 1px dotted #000000;

height: 200px;
overflow: auto;

}

FreakStyley · 11-05-2005, 10:37

Hi brown, thanks for quick reply.

I've applied it to the #div-content

Thats more what I want but I need it now to go right down to the bottom edge without pushing/breaking (visually) the tables dimensions. I need it to stretch with the browser, so that the content pans out/up. is there some other code I need? I've just seen in dreamweaver help where you can "encapsulate" any table with a div tag...thats cool. I'll be using it from now on when I get this working right!

FreakStyley · 11-05-2005, 10:55

Ok, with this, I have the look that I want:

#div-main {
background-color: #CCCC99;
margin: 10px;
border: 1px dotted #000000;
}
#div-content {
border: 1px DASHED #000000;
margin: 10px;
height: 390px;
overflow: auto;

but it doesn't stretch with my browser. how do I do that? I put "height: 100%;" instead of the "height: 390px;" but that just expands down the page overflowing the borders I need to keep (visually).

how can I stretch the page to be 100% to the size of the users browser/screen resolution?

- F

Brown · 11-05-2005, 10:55

you don't need the table. replace the table with a div and give it the same properties that you gave the table. divs in divs.

FreakStyley · 11-05-2005, 11:26

what like this?
<div id="div-table"> (where the table used to be?)
<div id="div-main">
<div id="div-content">

this makes the "design" break. (?)

Brown · 11-05-2005, 11:46

tables have tops and bottoms. so do divs. i imagine, you do too.

FreakStyley · 11-05-2005, 22:31

hi Brown,

hahaha - I had the bottoms but it was still pushing/breaking the layout of the needed table.

can I manually put tables/tds inside a div? for creating updates in my page? anyone?

FreakStyley · 11-05-2005, 22:56

Ok guys thank for your help...I have the div thing working...for the moment! I started coding by hand and everything started coming together. I have learned NOT to trust dreamweaver for a second!

thanks again! bottoms up! haha

PS: Hey Brown....thats the MOST post by a forum member I've seen yet! "guinness book of posts"

pgo · 12-05-2005, 05:29

Quote:

Originally Posted by FreakStyley

I have learned NOT to trust dreamweaver for a second!

The journey of a thousand miles starts with a single step.

08-05-2005, 15:32	#1 (permalink)
FreakStyley rejected CSS offspring! Join Date: May 2005 Location: Lost somewhere in western europe! Posts: 29	iframe? frames? some other way? Hi all, I've been working on my website and trying to make it load as fast as possible. I'm using dreamweaver and the design side has gone ok. I'm an artist and want to load pages into a "gallery" area in the middle of the viewing area. at present I'm using an iframe. is this the best way to go about it? also the iframe doesn't show in IE, only in mozilla firefox. here is the code I'm using (loading the called page into a table): <IFRAME name=Content align=center src="content/content_1.htm" frameBorder=0 width="100%" height=100%></IFRAME> is there something else I can do to make it run faster....the page thats loaded (although just text) takes the longest to load....the Iframe content (text) also takes quite a while to load locally. Thanks in advance, - FreakStyley

08-05-2005, 16:31	#2 (permalink)
Cborrow I like code. Join Date: Dec 2004 Location: Chesapeake, VA Posts: 229	Just use a <p> tag, and the overflow: auto; attribute in your css so something like this. Code: <html> <head> <title>What ever</title> <style type="text/css"><!-- #content { color: #000000; font-family: Verdana, Arial; font-size: 8pt; overflow: auto; } --></style> </head> <body> <div id="content"> <p>Your content goes here</p> </div> </body> </html> There that way you can have your scrollbars and such, and have all your content on one page so you don't have to load up a bunch of other pages that are in Iframes also. -Cory Last edited by Cborrow : 09-05-2005 at 14:48.

08-05-2005, 18:27	#3 (permalink)
roto Floating libation anyone? Join Date: Apr 2003 Location: El Barco del Amor Posts: 4,650	Isn't it better to us a <div> for your content? __________________ fun: HGC v.4 \| last.fm: DT \| me \| *oi! fck u roto: ...via meebo! New to interweb design?** Your friends at dt can help.

08-05-2005, 20:12	#4 (permalink)
FreakStyley rejected CSS offspring! Join Date: May 2005 Location: Lost somewhere in western europe! Posts: 29	... Cborrow: that doesn't really apply to what I need as I have a graphics heavy gallery with 6 different categories. all linking from the menu on the right. I need that different content appears in the middle "content" section with a single click on the right menu. So far, like I said, I'm using the iframe and its loading basic enough...but very slow (even locally).....is there be any other way (I'm using DreamWeaver 7.0)?? Roto: can you explain a basic "page load" idea with the <div> tag? (I'm 90% designer, 10% god only knows)

11-05-2005, 10:23	#8 (permalink)
FreakStyley rejected CSS offspring! Join Date: May 2005 Location: Lost somewhere in western europe! Posts: 29	hi thanks for the reply guys. @emilpaun: I gave up on the iframe idea. everyone seems to like the div better. ya learn something new everyday ok, so its better to have everything on the one page? I know the images will cache. I've got dial-up and every page click seems to reload the same images (they're all 12kb or less, which is nothing)? the <div> idea is good! (thanks) I never thought about that (I'm self taught...doesn't it show! haha) I always assumed it would be better if the pages loaded INTO the areas needed. hell, one page suits me for the coding issues alone. ok so here is the problem....I'm trying to confine the <div> to a certain layout on my page. VERY similar actually to the typical "post reply" in forums...just the VISUAL aspect of it when we are typing a LONG reply (like this one) the important thing i need is to make it (#2) stop hard at the bottom (V), but stretch with the browser (W). do I need another div element? at the moment it just keeps scrolling down the screen (its driving me nuts! I HATE the way in which I can't define its borders (I wish dreamweaver was more like photoshop! WYSIWYREALLYG) other question: how can I make the page go 100% vertical with the browser for people with large monitors? (I'm designing it for 1024x768 and up) thats why I tried frames in the first place. one at the bottom at least. help please!!!! Last edited by FreakStyley : 12-05-2005 at 12:47.

08-05-2005, 21:30	#6 (permalink)
pgo Senior Member Join Date: Jan 2005 Posts: 12,340	With the CSS overflow property you don't need frames of any type - at all. That's why the W3C deprecated frames. Try doing this - setting up a <div> for each column, and for whichever column you want to scroll, set overflow to auto. I think. I've personally never used the pseudo-frames technique because I find it obnoxious.

09-05-2005, 04:00	#7 (permalink)
emil dt immigrant Join Date: Nov 2004 Location: Bucharest - Romania Posts: 7,012	iframes are bad for seo puropses, but if you don't care about google, and are concerned about loading speed just go ahead. if you just want the iframe "feel" use a scrollable div. It's very strange that the iframe does not show in IE, could you post a link?

11-05-2005, 10:31	#9 (permalink)
Brown volkswagen yellow & gold Join Date: Apr 2003 Location: london, england. Posts: 6,147	give the content you want to scroll a fixed height. then add overflow properties. as below. #div-main { background-color: #CCCC99; margin: 10px; border: 1px dotted #000000; height: 200px; overflow: auto; }

11-05-2005, 10:37	#10 (permalink)
FreakStyley rejected CSS offspring! Join Date: May 2005 Location: Lost somewhere in western europe! Posts: 29	Hi brown, thanks for quick reply. I've applied it to the #div-content Thats more what I want but I need it now to go right down to the bottom edge without pushing/breaking (visually) the tables dimensions. I need it to stretch with the browser, so that the content pans out/up. is there some other code I need? I've just seen in dreamweaver help where you can "encapsulate" any table with a div tag...thats cool. I'll be using it from now on when I get this working right! Last edited by FreakStyley : 12-05-2005 at 12:48.

11-05-2005, 10:55	#11 (permalink)
FreakStyley rejected CSS offspring! Join Date: May 2005 Location: Lost somewhere in western europe! Posts: 29	Ok, with this, I have the look that I want: #div-main { background-color: #CCCC99; margin: 10px; border: 1px dotted #000000; } #div-content { border: 1px DASHED #000000; margin: 10px; height: 390px; overflow: auto; but it doesn't stretch with my browser. how do I do that? I put "height: 100%;" instead of the "height: 390px;" but that just expands down the page overflowing the borders I need to keep (visually). how can I stretch the page to be 100% to the size of the users browser/screen resolution? - F

11-05-2005, 10:55	#12 (permalink)
Brown volkswagen yellow & gold Join Date: Apr 2003 Location: london, england. Posts: 6,147	you don't need the table. replace the table with a div and give it the same properties that you gave the table. divs in divs.

11-05-2005, 11:26	#13 (permalink)
FreakStyley rejected CSS offspring! Join Date: May 2005 Location: Lost somewhere in western europe! Posts: 29	what like this? <div id="div-table"> (where the table used to be?) <div id="div-main"> <div id="div-content"> this makes the "design" break. (?)

11-05-2005, 11:46	#14 (permalink)
Brown volkswagen yellow & gold Join Date: Apr 2003 Location: london, england. Posts: 6,147	tables have tops and bottoms. so do divs. i imagine, you do too.

11-05-2005, 22:31	#15 (permalink)
FreakStyley rejected CSS offspring! Join Date: May 2005 Location: Lost somewhere in western europe! Posts: 29	hi Brown, hahaha - I had the bottoms but it was still pushing/breaking the layout of the needed table. can I manually put tables/tds inside a div? for creating updates in my page? anyone?

11-05-2005, 22:56	#16 (permalink)
FreakStyley rejected CSS offspring! Join Date: May 2005 Location: Lost somewhere in western europe! Posts: 29	Ok guys thank for your help...I have the div thing working...for the moment! I started coding by hand and everything started coming together. I have learned NOT to trust dreamweaver for a second! thanks again! bottoms up! haha PS: Hey Brown....thats the MOST post by a forum member I've seen yet! "guinness book of posts"

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)

Thread Tools	Search this Thread
Show Printable Version Email this Page	Search this Thread: Advanced Search