PDA

View Full Version : Help with a new layout



cococomics
December 31st, 2004, 15:35
Hi everyone. I am working on a new layout, and I need a little help. First of all, I know frames are not reccomended; are iframes just as bad? A

And second, look here: http://www.cococomics.net/images/testtem.png .
I am working on making this layout. There will be more of the green buttons also, but I was wondering if there was any way to make it so that when a user hovers over a green button, a word could appear in the small black rectangle below the buttons. For instance, if you hover over the first button, the word "comics" appears in the rectangle. This would preferably be in white font.

Any help, resources or HTML bits would help greatly!

Thanks!
-Cococomics

kabatak
December 31st, 2004, 16:07
are iframes just as bad?
yes, prefered way is to use a css overflow:auto on divs or tables



when a user hovers over a green button, a word could appear in the small black rectangle below the buttons. For instance, if you hover over the first button, the word "comics" appears in the rectangle.
I'm a bit lazy to do the actual coding but search on javascript: onMouseOver, onMouseOut, innerHTML, getElementByID. :biggrin2:

Decker
December 31st, 2004, 16:15
Nice look and feel, especially for the probable subject :biggrin2:

Frames - avoid like the plague, tables are actually a lot more flexible. But it all depends what your using for the layout as in design software.

iFrames can be a bit funny but are great for on-the-fly editing and changes without a load of knowledge or editing an entire page as you can target a simple html file to the iFrame, which means you can embed CS info in the html as well.

The mouseover could be done in various ways, but again it's dependant on how your doing the site ,either a script or alternate image.

HTH

cococomics
December 31st, 2004, 21:06
Thanks for the compliment! I will start searching for the specifics on the code. I'm going to use a CSS overflow:auto .

I always try to do layouts without any special programs, for instance I just used Paint shop for the buttons and such.

I will let you know how everything turns out. If anyone else reads this that would know the specific code, still post it!

Thanks again!

LockerGirl
December 31st, 2004, 21:49
Neat site. Like it alot. But i noticed, in the rounded section of the layout, above the Welcome text that the curves are a bit scribbly
http://optinom.info/testtem.png.

Its outlined in red for ya, in the pic above. just an idea, i have a tutorial on how to get purfect edges there, so PM me and we can talk more.
if you like. sorry if im being rude.

cococomics
December 31st, 2004, 23:01
thanks! it's not rude at all! I like to get comments and suggestion. I will send a PM.

cococomics
January 1st, 2005, 00:23
someone suggested I use this code for this.


<script language="JavaScript" type="text/javascript">
<!-- Hide the script from old browsers --
img0_on = new Image(width,height);
img0_on.src="image2.gif";
img0_off = new Image(width,height);
img0_off.src="image1.gif";

img1_on = new Image(width,height);
img1_on.src="image4.gif";
img1_off = new Image(width,height);
img1_off.src="image3.gif";
img2_on = new Image(width,height);
img2_on.src="image6.gif";
img2_off = new Image(width,height);
img2_off.src="image5.gif";

img3_on = new Image(width,height);
img3_on.src="image8.gif";
img3_off = new Image(width,height);
img3_off.src="image7.gif";
function over_image(parm_name)
{
document[parm_name].src = eval(parm_name + "_on.src");
}
function off_image(parm_name)
{
document[parm_name].src = eval(parm_name + "_off.src");
}
// --End Hiding Here -->
</script>


But I'm not sure how I can apply it to the layout, as in which image names go where.