PDA

View Full Version : x.x question on...hard to name it.


pj34
02-25-2010, 05:57 PM
Mmk, I need mt banner to be in a DIV yet still use the map, i can't get it to work...at all. Can anyone help? :smile:
The code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Flygon Hollow • v1.2 • Mythical Entity</title>
<link rel="shortcut icon" href="images/layout/favicon.png" />
<style type="text/css">
<!--
body {
font: 100% Verdana, Arial, Helvetica, sans-serif;
background: #666666;
margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
padding: 0;
text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
color: #000000;
}
.twoColFixLtHdr #container {
width: 900px; /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
background: #FFFFFF;
margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
border: 1px solid #000000;
text-align: left; /* this overrides the text-align: center on the body element. */
background-image:url('http://www.thepokeoasis.com/flygon/bg.png');
background-repeat:repeat-y;
}
.twoColFixLtHdr #header {
background: #DDDDDD;
width:900px;
height:315px;
padding: 0 0px 0 0px; /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
background-image: url('http://thepokeoasis.com/flygon/fixed2header.png');
}
.twoColFixLtHdr #h2 {
margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
padding: 0px 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
background-image: url('http://thepokeoasis.com/flygon/fixed2header.png');
}
.twoColFixLtHdr #header h1 {
margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
padding: 0px 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
}
.twoColFixLtHdr #sidebar1 {
float: left; /* since this element is floated, a width must be given */
width: 200px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
padding: 15px 10px 15px 20px;
}
.twoColFixLtHdr #content {
margin: 0 0 0 250px; /* the left margin on this div element creates the column down the left side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
padding: 0 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
width:480px;
}
.twoColFixLtHdr #rightnav {
margin: 0 0 0 788px; /* the left margin on this div element creates the column down the left side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
padding: 0px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
width:99px;
border: 1px solid #000000;
background-color: #d8d8d8;
font-size: 11px;
font-family: Arial;

}
.twoColFixLtHdr #footer {
padding: 0 0px 0 0px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
background:#e8e8e8;
background-image: url('http://thepokeoasis.com/flygon/footer2.png');
background-repeat: no-repeat;
}
.twoColFixLtHdr #footer p {
margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
padding: 0px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
float: right;
margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page */
float: left;
margin-right: 8px;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
clear: both;
height:0;
font-size: 1px;
line-height: 0px;
}
body,td,th {
font-family: "Times New Roman", Times, serif;
}
a:link {
text-decoration: none;
color: #464646;
}
a:visited {
text-decoration: none;
color: #464646;
}
a:hover {
text-decoration: none;
color: #0269ab;
}
a:active {
text-decoration: none;
color: #464646;
}
h6 {
font-family: Arial;
font-size: 12px;
color: #000000;
font-weight: bold;
text-align: center;
margin:3px;
border: 1px solid #000000;
background-color: #e6e6e6;
}
h5 {
font-family: Arial;
font-size: 15px;
color: #000000;
font-weight: bold;
text-align: center;
margin:3px;
border: 1px solid #000000;
background-color: #dddddd;
}
h2 {
font-family: Arial;
font-size: 13px;
color: #000000;
font-weight: bold;
text-align: center;
margin-top:3px;
margin-left:22px;
border: 1px solid #000000;
background-color: #dddddd;
}
-->
</style><!--[if IE 5]>
<style type="text/css">
/* place css box model fixes for IE 5* in this conditional comment */
.twoColFixLtHdr #sidebar1 { width: 230px; }
</style>
<![endif]--><!--[if IE]>
<style type="text/css">
/* place css fixes for all versions of IE in this conditional comment */
.twoColFixLtHdr #sidebar1 { padding-top: 30px; }
.twoColFixLtHdr #mainContent { zoom: 1; }
/* the above proprietary zoom property gives IE the hasLayout it needs to avoid several bugs */
</style>
<![endif]-->

<script type="text/javascript">
<!--
if (document.images) {
button00 = new Image
button01 = new Image
button02 = new Image
button03 = new Image
button04 = new Image
button05 = new Image
button06 = new Image
button07 = new Image
button08 = new Image
button09 = new Image
button10 = new Image
button11 = new Image
button12 = new Image
button13 = new Image
button14 = new Image
button15 = new Image
button16 = new Image
button17 = new Image
button18 = new Image
button19 = new Image
button20 = new Image
button21 = new Image
button22 = new Image
button23 = new Image
button24 = new Image
button25 = new Image
button26 = new Image
button27 = new Image
button28 = new Image
button29 = new Image
button30 = new Image
button31 = new Image
button32 = new Image
button33 = new Image
button34 = new Image
button35 = new Image
button36 = new Image
button37 = new Image
button38 = new Image
button39 = new Image


button00.src="images/aff/nub.png"
button01.src="images/aff/tpirpg2.png"
button02.src="images/aff/shrpg.png"
button03.src="images/aff/tpurpg.png"
button04.src="images/aff/pkmnpwns.png"
button05.src="images/aff/gp.png"
button06.src="images/aff/pr.png"
button07.src="images/aff/onogori.png"
button08.src="images/aff/pikascorn.png"
button09.src="images/aff/***.png"
button10.src="images/aff/tpk.png"
button11.src="images/aff/tpc.png"
button12.src="images/aff/kas.png"
button13.src="images/aff/floatzel-net.png"
button14.src="images/aff/mighymount.png"
button15.src="images/aff/teamrango.png"
button16.src="images/aff/evoly.png"
button17.src="images/aff/griffinden.png"
button18.src="images/aff/u-p.png"
button19.src="images/aff/pkmnoasis.png"
button20.src="images/aff/cressmoon.png"
button21.src="images/aff/ll.png"
button22.src="images/aff/pokerev.png"
button23.src="images/aff/pkmnworld.png"
button24.src="images/aff/achamo.png"
button25.src="images/aff/skypillar.png"
button26.src="images/aff/pokegen.png"
button27.src="images/aff/ds.png"
button28.src="images/aff/tsp.png"
button29.src="images/aff/pm.png"
button30.src="images/aff/pp.png"
button31.src="images/aff/ev.png"
button32.src="images/aff/hi.png"
button33.src="images/aff/sa.png"
button34.src="images/aff/fc.png"
button35.src="images/aff/pe.png"
button36.src="images/aff/tpl.png"
button37.src="images/aff/ip.png"
button38.src="images/aff/button2.png"
button39.src="images/aff/MudkipButton.png"
}// -->
</script>
</head>

<body class="twoColFixLtHdr">

<div id="container">

<div id="header">
<h1><img src="http://thepokeoasis.com/flygon/header2fixed.png" width="900" alt="Banner" height="315" border="0" usemap="#Map" />

<map name="Map" id="Map">

<area shape="rect" coords="302,235,370,250" href="index_homepage.php" alt="Link" />
<area shape="rect" coords="375,235,430,250" href="http://www.punbb-hosting.com/forums/FlygonHollow/index.php" alt="Link" />
<area shape="rect" coords="440,235,475,250" href="http://xat.com/FlygonHollow" alt="Link" />
<area shape="rect" coords="485,235,561,250" href="staff_login.php" alt="Link" />
</map>

</h1>
<!-- end #header --></div>
<div id="sidebar1">

<center><h5>Sitely</h5>
<a href="flyfile.php">News</a><br />
<a href="archives.php">Archived News</a><br />
<a href="staff.php">Staff</a><br />
<a href="contact.php">Contact Us</a><br />
<a href="affiliate.php">Affiliate?</a><br />

<a href="linktous.php">Link To Us</a><br />
<a href="try.php">Coming Soon</a><br />
<a href="thank.php">Special Thanks</a><br />

<h5>Pok&eacute;mon</h5>
<a href="chart.php">Types Chart</a><br />
<a href="typecalc.php">Type Calculator</a><br />
<a href="types.php">Types Directory</a><br />
<a href="regions.php">Regions Directory</a><br />

<a href="maps.php">Region Maps</a><br />
<a href="pokeofthemonth.php">Pokemon Of The Month</a><br />

<h5>Free Graphics</h5>
<a href="banners.php">Banners</a><br />
<a href="bannertemp.php">Banner Templates</a><br />
<a href="buttondone.php">Buttons</a><br />
<a href="buttontemp.php">Button Templates</a><br />
<a href="splashes.php">Splashes</a><br />

<a href="avatars.php">Avatars</a><br />
<a href="favicons.php">Favicons</a><br />

<h5>Games</h5>
<a href="redj.php">Red &amp; Green</a><br />
<a href="rby.php">Red, Blue, &amp; Yellow</a><br />
<a href="csg.php">Gold, Silver, &amp; Crystal</a><br />

<a href="rse.php">Ruby, Sapphire, &amp; Emerald</a><br />
<a href="frlg.php">Fire Red &amp; Leaf Green</a><br />
<a href="dpp.php">Diamond, Pearl, &amp; Platinum</a><br />
<a href="hgssP.php">Heart Gold &amp; Soul Silver</a><br />

<h5>Artwork</h5>
<a href="Gallery.php">Art Gallery</a><br />
<a href="recolor.php">Recoloring Guide</a><br />
<a href="splice.php">Splicing Guide</a><br />
<a href="revamp.php">Revamping Guide</a><br />

<h5>Web Help</h5>
<a href="relcss.php">External StyleSheet</a><br />
<a href="relfav.php">Shortcut Icon</a><br />

<a href="hover.php">Javascript Hover</a><br />
<a href="ssi.php">SSI/PHP Include</a><br />
<a href="phpstyleswitcher.php">PHP StyleSwitcher</a><br />
<a href="freelayouts.php">Free Layouts</a><br />

<h5>Fun</h5>
<a href="map.php">Find Lugia</a><br />
<a href="guess.php">Trivia</a><br />
<a href="js.php">Guess The Number</a><br />

<a href="wsearch.php">Word Search</a><br />
<a href="crossw.php">CrossWord Puzzle</a><br />
<a href="findthatpage.php">Hidden Page</a><br />
</center> <!-- end #sidebar1 -->

</div>
<div id="content">
<center><h2>Hello World!</h2> Hey, it's pj testing out the new layout. ;)</center>

<!-- end #mainContent --></div>

<!-- This clearing element should immediately follow the #mainContent div in order to force the #container div to contain all child floats -->
<div id="rightnav">
<center>
<h6>StyleSwitcher</h6>
<a href="http://flygon-hollow.co.cc/switcher.php?set=http://flygon-hollow.co.cc/flygon">Flygon</a><br />
<a href="http://flygon-hollow.co.cc/switcher.php?set=http://flygon-hollow.co.cc/lugia">Lugia</a><br />
<a href="http://flygon-hollow.co.cc/switcher.php?set=http://flygon-hollow.co.cc/marowak">Marowak</a><br />
<a href="http://flygon-hollow.co.cc/switcher.php?set=http://flygon-hollow.co.cc/scyther">Scyther</a><br />

<a href="http://flygon-hollow.co.cc/switcher.php?set=http://flygon-hollow.co.cc/dialga">Dialga</a><br /><br />

<h6>Friends</h6>

<a href="http://dolloff.net/main/index.shtml" target="_blank"><img src="images/aff/tsp.png" alt="The Sky Pillar" border="0"/></a><br />
<a href="http://pokemonpwns.co.cc/" target="_blank"><img src="images/aff/pp.png" alt="Pok&eacute;mon Pwns" border="0"/></a><br /><br />

<h6>Affiliates</h6>
<a href="affiliate.php"><img src="/images/aff/nub.png" name="button" alt="button" vspace="1" border="0" width="88" height="31" /></a><br />
<a onmouseover="document.button.src=button01.src"
onmouseout="document.button.src=button00.src" href="http://tpirpg.co.tv/" target="_blank">Pok&eacute;mon Island</a><br />
<a onmouseover="document.button.src=button05.src"
onmouseout="document.button.src=button00.src" href="http://www.glaceonpalace.co.cc/" target="_blank">Glaceon Palace</a><br />

<a onmouseover="document.button.src=button06.src"
onmouseout="document.button.src=button00.src" href="http://pikachuregion.co.cc/" target="_blank">Pikachu Region</a><br />
<a onmouseover="document.button.src=button07.src"
onmouseout="document.button.src=button00.src" href="http://onogori.pkmnnation.com/" target="_blank">Onogori-PMD</a><br />
<a onmouseover="document.button.src=button09.src"
onmouseout="document.button.src=button00.src" href="http://thepokemonmansion.net78.net/" target="_blank">Pok&eacute;mon Mansion</a><br />

<a onmouseover="document.button.src=button12.src"
onmouseout="document.button.src=button00.src" href="http://kasumi.net.tc/" target="_blank">Kasumi</a><br />
<a onmouseover="document.button.src=button13.src"
onmouseout="document.button.src=button00.src" href="http://www.floatzel.net/" target="_blank">Floatzel.Net</a><br />
<a onmouseover="document.button.src=button14.src"
onmouseout="document.button.src=button00.src" href="http://mightyenasmountain.pkmnnation.com/" target="_blank">Mightyena's Mountain</a><br />
<a onmouseover="document.button.src=button15.src"
onmouseout="document.button.src=button00.src" href="http://teamrango.pokemonfan.net/" target="_blank">Team Rango</a><br />
<a onmouseover="document.button.src=button16.src"
onmouseout="document.button.src=button00.src" href="http://evoly.webs.com/" target="_blank">Evoly</a><br />

<a onmouseover="document.button.src=button17.src"
onmouseout="document.button.src=button00.src" href="http://guardeddreams.site40.net/home.php" target="_blank">Guarded Dreams</a><br />
<a onmouseover="document.button.src=button18.src"
onmouseout="document.button.src=button00.src" href="http://umbreonspalace.theforestmanor.com/" target="_blank">Umbreon's Palace</a><br />
<a onmouseover="document.button.src=button19.src"
onmouseout="document.button.src=button00.src" href="http://thepokeoasis.com/" target="_blank">Pok&eacute;mon Oasis</a><br />

<a onmouseover="document.button.src=button22.src"
onmouseout="document.button.src=button00.src" href="http://www.pokereview.net/" target="_blank">Pok&eacute;Review</a><br />
<a onmouseover="document.button.src=button23.src"
onmouseout="document.button.src=button00.src" href="http://www.kimsites.net/pokemon/" target="_blank">We All Live In a Pok&eacute;mon World</a><br />
<a onmouseover="document.button.src=button24.src"
onmouseout="document.button.src=button00.src" href="http://achamo-torchic.floatzel.net/" target="_blank">Achamo~Torchic</a><br />
<a onmouseover="document.button.src=button26.src"
onmouseout="document.button.src=button00.src" href="http://pokegen.net/" target="_blank">Pok&eacute;mon Generations</a><br />

<a onmouseover="document.button.src=button27.src"
onmouseout="document.button.src=button00.src" href="http://ds.rothion.com/" target="_blank">Dewgong's Sea</a><br />
<a onmouseover="document.button.src=button29.src"
onmouseout="document.button.src=button00.src" href="http://pokemon-mania.net/" target="_blank">Pok&eacute;mon Mania</a><br />
<a onmouseover="document.button.src=button31.src"
onmouseout="document.button.src=button00.src" href="http://eevee-valley.eeveeshq.com/" target="_blank">Eevee Valley</a><br />

<a onmouseover="document.button.src=button32.src"
onmouseout="document.button.src=button00.src" href="http://hoshiko.netii.net/" target="_blank">Hioshiko Designs</a><br />
<a onmouseover="document.button.src=button33.src"
onmouseout="document.button.src=button00.src" href="http://swalotsave.info/" target="_blank">Swalot's Avenue</a><br />
<a onmouseover="document.button.src=button34.src"
onmouseout="document.button.src=button00.src" href="http://firechao.com/" target="_blank">Fire Chao</a><br />
<a onmouseover="document.button.src=button35.src"
onmouseout="document.button.src=button00.src" href="http://pokemonelement.com/" target="_blank">Pok&eacute;mon Element</a><br />

<a onmouseover="document.button.src=button36.src"
onmouseout="document.button.src=button00.src" href="http://www.thepkmnleague.co.cc/" target="_blank">Pok&eacute;mon League</a><br />
<a onmouseover="document.button.src=button37.src"
onmouseout="document.button.src=button00.src" href="http://pulse.eeveeshq.com/" target="_blank">Indigo Plateau</a><br />
<a onmouseover="document.button.src=button38.src"
onmouseout="document.button.src=button00.src" href="http://shadowpokes.eeveeshq.com/" target="_blank">Shadow Pokes</a><br />
<a onmouseover="document.button.src=button39.src"
onmouseout="document.button.src=button00.src" href="http://miharu.fu8.com/" target="_blank">Dark Dragons</a><br /><br />

<h6>Advertised At</h6>
<a href="http://twilightharbour.eeveeshq.com/topsites/index.php?a=in&u=pj34" target="_blank"><img src="http://twilightharbour.eeveeshq.com/topsites/button.php?u=pj34" alt="Twilight Harbour .x. t o p 5 0" border="0" /></a>
<br />
<a href="http://floatzel.net/topsites/" target="_blank"><img src="http://floatzel.net/topsites/button.php?u=pj34" alt="Floatzel.Net Topsites" border="0" /></a><br />
<a href="http://top50.pokestation.net/" target="_blank"><img src="http://top50.pokestation.net/button.php?u=pj34" alt="PokéStation: Top 50 Rankings - All Sites" border="0" /></a><br />
<a href="http://topsites.cavernofmew.com/" target="_blank"><img src="http://topsites.cavernofmew.com/button.php?u=pj34" alt="Cavern of Mew Topsites" border="0" /></a><br />

<!-- data banner code begin -->
<a href="http://flygonhollow.gotop100.com/in.php?ref=101" target="_blank">

<img src="http://flygonhollow.gotop100.com/lists/flygonhollow/custombanners/68086.png" border="0"> </a>
<!-- data banner code end -->

<h6>Stats</h6>
<a href="http://www.histats.com" alt="free webpage hit counter"><embed src="http://s10.histats.com/344.swf" flashvars="jver=1&acsid=999906&domi=4&cpagid=0" quality="high" width="112" height="48" name="344.swf" align="middle" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" wmode="transparent" /></a>
</center></div>
<br class="clearfloat" />
<div id="footer">
<br /><br /><br /><br /><br /><br />

<!-- end #footer --></div>
<!-- end #container --></div>
</body>
</html>

Jefff
02-25-2010, 08:37 PM
Put your css and javascript in separate files first of all, then make sure the page validates ( http://validator.w3.org/#validate_by_input ) (it doesn't).

If the problem is still there, try describing the problem you're having.

pj34
02-25-2010, 09:32 PM
What javascript? all i use is my hover...

Jefff
02-25-2010, 09:51 PM
"<script type="text/javascript">"

followed by 20 or so lines of javascript.

pj34
02-26-2010, 05:17 PM
Ah, yes...well i've not put this layout up yet, as the css isnt done.

pj34
02-26-2010, 07:27 PM
Nvm, i found a guide on a complicated way to do exactly hat i wanted to do.