New layout is finally finished........

[NUTNDUN]

I finally have the new layout for the site done, it is 99% finished other then a couple of minor changes that I want to make and one or two bugs to take care of. I would love to hear any comments whether they are good or bad, and I can use the input to finalize it then I will start submitting to the search engines and concentrate on the content of the site. The site is here www.itcommunitycorner.com thanks

[Sinecure]

Was this the one Dreamcaster helped on?

[NUTNDUN]

Yep it be the one, he did all of the images and I did the hacking. I am going to be doing some of the contents hopefully this weekend so I can some plugs in for him

[Sinecure]

Yeah, he worked pretty hard on it, you to. Good job

[Valkyre]

Very nice, now all you need is some members

[George L]

nice but at 800x600 i have about 20 - 30 pixels of horizontal scrolling to do

[NUTNDUN]

I am starting to work on the members part this week. As for the 800x600, I thought about making it a little smaller but I didn't want to sacrifice too much room, It may be something I work on a little later. Thanks for the input.

[Martz]

Looks great - I would recommened you change the mouseover code to something which works a bit better though. Takes a while for the images to rollover or load. Much better ways to do this if you hunt around.

But looks great.

[NUTNDUN]

I was trying to mess with the code but everytime I do I get the runtime errors. I will have to play around some more. Thanks for the tip

[c-prompt]

Here is a good roll over script that also preloads the images.

In the header put:

<script language="javascript"> 
<!-- 

if (document.images) { 
image1on = new Image(); 
image1on.src = "images/about_us_on.gif"; 
image1off = new Image(); 
image1off.src = "images/about_us_off.gif"; 

} 

function changeImages() { 
if (document.images) { 
for (var i=0; i<changeImages.arguments.length; i+=2) { 
document[changeImages.arguments[i]].src = eval(changeImages.arguments[i+1] + ".src"); 
} 
} 
} 

// --> 
</script>

Around the images to rollover put:

<a href="about_us.shtml" onmouseover="changeImages('image1', 'image1on')" onmouseout="changeImages('image1', 'image1off')"><img name="image1" src="images/about_us_off.gif"></a>

Then to add more just copy the 4 lines in the java code and make 1, 2 ,3, etc.

[NUTNDUN]

Hey C-prompt,
Javascript is definately not my cup of tea. The script I have was made by photoshop. For some reason there is like four images to each rollover. I will post all of the code and if ya wouldn't mind making an example out of one line of it to get me in the right direction of making it work with the code you posted that would be awesome.

Here is the script that I have in the headinclude template;

<script language="JavaScript">

function newImage(arg) {
if (document.images) {
rslt = new Image();
rslt.src = arg;
return rslt;
}
}

function changeImages() {
if (document.images && (preloadFlag == true)) {
for (var i=0; i<changeImages.arguments.length; i+=2) {
document[changeImages.arguments[i]].src = changeImages.arguments[i+1];
}
}
}

var preloadFlag = true;
function preloadImages() {
if (document.images) {
itcclayouttest_12_over = newImage("http://themes.itcommunitycorner.com/forums/themes/newstyle/itcclayouttest_12-over.gif");
itcclayouttest_13_itcclayouttest_12_over = newImage("http://themes.itcommunitycorner.com/forums/themes/newstyle/itcclayouttest_13-itcclayou.gif");
itcclayouttest_13_over = newImage("http://www.itcommunitycorner.com/forums/themes/newstyle/itcclayouttest_13-over.gif");
itcclayouttest_14_itcclayouttest_13_over = newImage("http://themes.itcommunitycorner.com/forums/themes/newstyle/itcclayouttest_14-itcclayou.gif");
itcclayouttest_14_over = newImage("http://themes.itcommunitycorner.com/forums/themes/newstyle/itcclayouttest_14-over.gif");
itcclayouttest_15_itcclayouttest_14_over = newImage("http://themes.itcommunitycorner.com/forums/themes/newstyle/itcclayouttest_15-itcclayou.gif");
itcclayouttest_15_over = newImage("http://themes.itcommunitycorner.com/forums/themes/newstyle/itcclayouttest_15-over.gif");
itcclayouttest_16_itcclayouttest_15_over = newImage("http://themes.itcommunitycorner.com/forums/themes/newstyle/itcclayouttest_16-itcclayou.gif");
itcclayouttest_16_over = newImage("http://themes.itcommunitycorner.com/forums/themes/newstyle/itcclayouttest_16-over.gif");
itcclayouttest_17_itcclayouttest_16_over = newImage("http://themes.itcommunitycorner.com/forums/themes/newstyle/itcclayouttest_17-itcclayou.gif");
itcclayouttest_17_over = newImage("http://themes.itcommunitycorner.com/forums/themes/newstyle/itcclayouttest_17-over.gif");
itcclayouttest_18_itcclayouttest_17_over = newImage("http://themes.itcommunitycorner.com/forums/themes/newstyle/itcclayouttest_18-itcclayou.gif");
itcclayouttest_18_over = newImage("http://themes.itcommunitycorner.com/forums/themes/newstyle/itcclayouttest_18-over.gif");
itcclayouttest_19_itcclayouttest_18_over = newImage("http://themes.itcommunitycorner.com/forums/themes/newstyle/itcclayouttest_19-itcclayou.gif");
itcclayouttest_19_over = newImage("http://themes.itcommunitycorner.com/forums/themes/newstyle/itcclayouttest_19-over.gif");
itcclayouttest_20_itcclayouttest_19_over = newImage("http://themes.itcommunitycorner.com/forums/themes/newstyle/itcclayouttest_20-itcclayou.gif");
preloadFlag = true;
}
}

</script>


And here is the code that is in the header template;

<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0>
<TR>
<TD>
<IMG SRC="http://themes.itcommunitycorner.com/forums/themes/newstyle/itcclayouttest_11.gif" WIDTH=307 HEIGHT=30></TD>
<TD>
<A HREF="$nukeurl/index.php?s=$session[sessionhash]"
ONMOUSEOVER="changeImages('itcclayouttest_12', '{imagesfolder}/itcclayouttest_12-over.gif', 'itcclayouttest_13', '{imagesfolder}/itcclayouttest_13-itcclayou.gif'); return true;"
ONMOUSEOUT="changeImages('itcclayouttest_12', '{imagesfolder}/itcclayouttest_12.gif', 'itcclayouttest_13', '{imagesfolder}/itcclayouttest_13.gif'); return true;">
<IMG NAME="itcclayouttest_12" SRC="{imagesfolder}/itcclayouttest_12.gif" WIDTH=47 HEIGHT=30 BORDER=0></A></TD>
<TD>
<A HREF="$bburl/index.php?s=$session[sessionhash]"
ONMOUSEOVER="changeImages('itcclayouttest_13', '{imagesfolder}/itcclayouttest_13-over.gif', 'itcclayouttest_14', '{imagesfolder}/itcclayouttest_14-itcclayou.gif'); return true;"
ONMOUSEOUT="changeImages('itcclayouttest_13', '{imagesfolder}/itcclayouttest_13.gif', 'itcclayouttest_14', '{imagesfolder}/itcclayouttest_14.gif'); return true;">
<IMG NAME="itcclayouttest_13" SRC="{imagesfolder}/itcclayouttest_13.gif" WIDTH=57 HEIGHT=30 BORDER=0></A></TD>
<TD>
<A HREF="$bburl/usercp.php?s=$session[sessionhash]"
ONMOUSEOVER="changeImages('itcclayouttest_14', '{imagesfolder}/itcclayouttest_14-over.gif', 'itcclayouttest_15', '{imagesfolder}/itcclayouttest_15-itcclayou.gif'); return true;"
ONMOUSEOUT="changeImages('itcclayouttest_14', '{imagesfolder}/itcclayouttest_14.gif', 'itcclayouttest_15', '{imagesfolder}/itcclayouttest_15.gif'); return true;">
<IMG NAME="itcclayouttest_14" SRC="{imagesfolder}/itcclayouttest_14.gif" WIDTH=56 HEIGHT=30 BORDER=0></A></TD>
<TD>
<A HREF="$bburl/register.php?s=$session[sessionhash]"
ONMOUSEOVER="changeImages('itcclayouttest_15', '{imagesfolder}/itcclayouttest_15-over.gif', 'itcclayouttest_16', '{imagesfolder}/itcclayouttest_16-itcclayou.gif'); return true;"
ONMOUSEOUT="changeImages('itcclayouttest_15', '{imagesfolder}/itcclayouttest_15.gif', 'itcclayouttest_16', '{imagesfolder}/itcclayouttest_16.gif'); return true;">
<IMG NAME="itcclayouttest_15" SRC="{imagesfolder}/itcclayouttest_15.gif" WIDTH=60 HEIGHT=30 BORDER=0></A></TD>
<TD>
<A HREF="$bburl/calendar.php?s=$session[sessionhash]"
ONMOUSEOVER="changeImages('itcclayouttest_16', '{imagesfolder}/itcclayouttest_16-over.gif', 'itcclayouttest_17', '{imagesfolder}/itcclayouttest_17-itcclayou.gif'); return true;"
ONMOUSEOUT="changeImages('itcclayouttest_16', '{imagesfolder}/itcclayouttest_16.gif', 'itcclayouttest_17', '{imagesfolder}/itcclayouttest_17.gif'); return true;">
<IMG NAME="itcclayouttest_16" SRC="{imagesfolder}/itcclayouttest_16.gif" WIDTH=64 HEIGHT=30 BORDER=0></A></TD>
<TD>
<A HREF="$bburl/memberlist.php?s=$session[sessionhash]"
ONMOUSEOVER="changeImages('itcclayouttest_17', '{imagesfolder}/itcclayouttest_17-over.gif', 'itcclayouttest_18', '{imagesfolder}/itcclayouttest_18-itcclayou.gif'); return true;"
ONMOUSEOUT="changeImages('itcclayouttest_17', '{imagesfolder}/itcclayouttest_17.gif', 'itcclayouttest_18', '{imagesfolder}/itcclayouttest_18.gif'); return true;">
<IMG NAME="itcclayouttest_17" SRC="{imagesfolder}/itcclayouttest_17.gif" WIDTH=72 HEIGHT=30 BORDER=0></A></TD>
<TD>
<A HREF="$nukeurl/modules.php?op=modload&name=FAQ&file=index&s=$session[sessionhash]"
ONMOUSEOVER="changeImages('itcclayouttest_18', '{imagesfolder}/itcclayouttest_18-over.gif', 'itcclayouttest_19', '{imagesfolder}/itcclayouttest_19-itcclayou.gif'); return true;"
ONMOUSEOUT="changeImages('itcclayouttest_18', '{imagesfolder}/itcclayouttest_18.gif', 'itcclayouttest_19', '{imagesfolder}/itcclayouttest_19.gif'); return true;">
<IMG NAME="itcclayouttest_18" SRC="{imagesfolder}/itcclayouttest_18.gif" WIDTH=32 HEIGHT=30 BORDER=0></A></TD>
<TD>
<A HREF="$bburl/search.php?s=$session[sessionhash]"
ONMOUSEOVER="changeImages('itcclayouttest_19', '{imagesfolder}/itcclayouttest_19-over.gif', 'itcclayouttest_20', '{imagesfolder}/itcclayouttest_20-itcclayou.gif'); return true;"
ONMOUSEOUT="changeImages('itcclayouttest_19', '{imagesfolder}/itcclayouttest_19.gif', 'itcclayouttest_20', '{imagesfolder}/itcclayouttest_20.gif'); return true;">
<IMG NAME="itcclayouttest_19" SRC="{imagesfolder}/itcclayouttest_19.gif" WIDTH=55 HEIGHT=30 BORDER=0></A></TD>
<TD>
<IMG NAME="itcclayouttest_20" SRC="{imagesfolder}/itcclayouttest_20.gif" WIDTH=45 HEIGHT=30></TD>
</TR>
</TABLE>

Thanks for your help. I will try to see if I can get it to work on my own, but if ya have time to give me an example I would really appreciate it.

[NUTNDUN]

Well I did the code like ya said on my test site, here is the code I have in my header template now,
<script language="javascript">
<!--

if (document.images) {
image1on = new Image();
image1on.src = "http://themes.itcommunitycorner.com/forums/themes/newstyle/home_on.gif";
image1off = new Image();
image1off.src = "http://themes.itcommunitycorner.com/forums/themes/newstyle/home_off.gif";
image2on = new Image();
image2on.src = "http://themes.itcommunitycorner.com/forums/themes/newstyle/forums_on.gif";
image2off = new Image();
image2off.src = "http://themes.itcommunitycorner.com/forums/themes/newstyle/forums_off.gif";
image3on = new Image();
image3on.src = "http://themes.itcommunitycorner.com/forums/themes/newstyle/usercp_on.gif";
image3off = new Image();
image3off.src = "http://themes.itcommunitycorner.com/forums/themes/newstyle/usercp_off.gif";
image4on = new Image();
image4on.src = "http://themes.itcommunitycorner.com/forums/themes/newstyle/register_on.gif";
image4off = new Image();
image4off.src = "http://themes.itcommunitycorner.com/forums/themes/newstyle/register_off.gif";
image5on = new Image();
image5on.src = "http://themes.itcommunitycorner.com/forums/themes/newstyle/calender_on.gif";
image5off = new Image();
image5off.src = "http://themes.itcommunitycorner.com/forums/themes/newstyle/calender_off.gif";
image6on = new Image();
image6on.src = "http://themes.itcommunitycorner.com/forums/themes/newstyle/members_on.gif";
image6off = new Image();
image6off.src = "http://themes.itcommunitycorner.com/forums/themes/newstyle/members_off.gif";
image7on = new Image();
image7on.src = "http://themes.itcommunitycorner.com/forums/themes/newstyle/faq_on.gif";
image7off = new Image();
image7off.src = "http://themes.itcommunitycorner.com/forums/themes/newstyle/faq_off.gif";
image8on = new Image();
image8on.src = "http://themes.itcommunitycorner.com/forums/themes/newstyle/search_on.gif";
image8off = new Image();
image8off.src = "http://themes.itcommunitycorner.com/forums/themes/newstyle/search_off.gif";

}

function changeImages() {
if (document.images) {
for (var i=0; i<changeImages.arguments.length; i+=2) {
document[changeImages.arguments[i]].src = eval(changeImages.arguments[i+1] + ".src");
}
}
}

// -->
</script>
<br>
<br>
<table width="795" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td width="100%" align="center">
<!---------------begin header image I messed with --------------->

<table border="0" cellspacing="0" cellpadding="0" align="center" background="{imagesfolder}/header_top.gif" width="795" height="103">
<tr>
<td valign="top" align="center"><img src="{imagesfolder}/pixel.gif" width="795" height="27"></td>
</tr>
<tr>
<td valign="top">
<table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td valign="top"><img src="{imagesfolder}/pixel.gif" width="294" height="76"></td>
<td valign="top" align="center" nowrap background="{imagesfolder}/clear.gif">
<center><smallfont> $showbanners </smallfont></center></td>
<td valign="top"><img src="{imagesfolder}/pixel.gif" width="31" height="76"></td>
</tr>
</table>
</td>
</tr>
</table>

<table width="795" height="30" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<img src="http://themes.itcommunitycorner.com/forums/themes/newstyle/menu_begin.gif" width="307" height="30"></td>
<TD>
<a href="$nukeurl/index.php?s=session[sessionhash]"" onmouseover="changeImages('image1', 'image1on')" onmouseout="changeImages('image1',
'image1off')"><img name="image1" src="http://themes.itcommunitycorner.com/forums/themes/newstyle/home_off.gif" width="47" height="30"></a>
</TD>
<TD>
<a href="$bburl/index.php?s=$sessio[sessionhash]"
onmouseover="changeImages('image1', 'image1on')" onmouseout="changeImages('image1', 'image1off')"><img name="image1" src="http://themes.itcommunitycorner.com/forums/themes/newstyle/forums_off.gif" width="57" height="30"></a>
</TD>
<TD>
<a href="$bburl/usercp.php?s=$session[sessionhash]" onmouseover="changeImages('image1', 'image1on')" onmouseout="changeImages('image1', 'image1off')"><img name="image1" src="http://themes.itcommunitycorner.com/forums/themes/newstyle/usercp_off.gif" width="56" height="30"></a>
</TD>
<TD>
<a href="$bburl/register.php?s=$session[sessionhash]" onmouseover="changeImages('image1', 'image1on')" onmouseout="changeImages('image1', 'image1off')"><img name="image1" src="http://themes.itcommunitycorner.com/forums/themes/newstyle/register_off.gif" width="60" height="30"></a>
</TD>
<TD>
<a href="$bburl/calendar.php?s=$session[sessionhash]" onmouseover="changeImages('image1', 'image1on')" onmouseout="changeImages('image1', 'image1off')"><img name="image1" src="http://themes.itcommunitycorner.com/forums/themes/newstyle/calender_off.gif" width="64" height="30"></a>
</TD>
<TD>
<a href="$bburl/memberlist.php?s=$session[sessionhash]" onmouseover="changeImages('image1', 'image1on')" onmouseout="changeImages('image1', 'image1off')"><img name="image1" src="http://themes.itcommunitycorner.com/forums/themes/newstyle/members_off.gif" width="72" height="30"></a>
</TD>
<TD>
<a href="$nukeurl/modules.php?op=modload&name=FAQ&file=index&s=$session[sessionhash]"
onmouseover="changeImages('image1', 'image1on')" onmouseout="changeImages('image1', 'image1off')"><img name="image1" src="http://themes.itcommunitycorner.com/forums/themes/newstyle/faq_off.gif" width="32" height="30"></a>
</TD>
<TD>
<a href="$bburl/search.php?s=$session[sessionhash]" onmouseover="changeImages('image1', 'image1on')" onmouseout="changeImages('image1', 'image1off')"><img name="image1"
src="http://themes.itcommunitycorner.com/forums/themes/newstyle/search_off.gif" width="55" height="30"></a>
</TD>
<TD>
<img src="http://themes.itcommunitycorner.com/forums/themes/newstyle/menu_end.gif" width="45" height="30"></TD>
</TR>
</TABLE>

And here is the output I am getting http://themes.itcommunitycorner.com/forums/
it's not doing the rollover and the table is all messed up. I anyone has any input on this it would be nice, I would like to get the rollover images to preload and rollover. Thanks.

[NUTNDUN]

I added a seperate preload script on the main site, and it is only set to preload the home button right now. I figured I could use this to test it. So if any one ya have time to spare and could check for me to see if the home button is preloading or not I would really appreciate it. For some reason I don't have any problems with the images not preloading for me. The main site can be found here www.itcommunitycorner.com thanks,

[c-prompt]

They loaded great for me now in the forums. But on the main page they didn't. However the home did appear to be already loaded. But it may have been in my cache. Nice forums.

[c-prompt]

The only thing I would change on the forums is the space below the info boxes and where the forums start. Seems there is an extra break in there that really isn't needed. Other than that I can't see anything I would change. You and Dreamcaster did a great job.