onClick problems... |
 Jul 31 2007, 09:14 PM
Post
#1
|
|
 Senior Member  Group: Member Posts: 63 Joined: Jun 2006 Member No: 427,490  |
I'm not even sure what it would be labeled as, but i'm trying to get my site to have different divs appear to the left of the image map once the item on the image map is clicked. The problem is: when the image map is clicked on, the page does nothing.
Here's the onclick code: CODE <img style="position: absolute; top: 15; left: 665;" border="0" src="http://www.myfilestash.com/userfiles/crystalp138/sidebarstuff.gif" width="343" height="561" usemap="#Map1"> <map id="Map1" name="Map1"> <AREA SHAPE=”rect” COORDS="79,41,270,67" name=”apparel" alt="apparel" onClick="changeNavigation('apparel')" title="apparel"> <AREA SHAPE=”rect” COORDS="68,81,273,169" name="posters" alt="posters" onClick="changeNavigation('posters')" title="posters"> <AREA SHAPE=”rect” COORDS="80,180,262,228" name= "decor" alt="decor" onClick="changeNavigation('decor')" title=”decor"> <AREA SHAPE=”rect” COORDS="85,236,265,286" name="cards" alt="cards" onClick="changeNavigation('cards')" title="cards"> <AREA SHAPE=”rect” COORDS="56,295,293,391" name="buttons" alt="buttons" onClick="changeNavigation('buttons')" title="buttons"> <AREA SHAPE=”rect” COORDS="40,396,316,457" name="misc" alt="misc" onClick="changeNavigation('misc')" title="misc"> <AREA SHAPE=”rect” COORDS="51,473,144,516" name="homie" alt="homie" onClick="changeNavigation('homie')" title="homie"> <AREA SHAPE=”rect” COORDS="169,474,297,519" name="contact" alt="contact" onClick="changeNavigation('contact')" title="contact"> </MAP> And here's the entire site code. CODE <html>
<head> <title>The Stuff</title> <style type="text/css"> <!-- A:link { text-decoration: none; color: 000000;} A:visited { text-decoration: none; color: 000000;} A:hover { font-family:trebuchet ms; font-size:14pt; color: 000000; font-weight:bold; line-height: 15px; text-transform: lowercase; } div { color: 000000; font-family: trebuchet ms; font-size: 11px; font-weight: normal; text-align: justify; text-decoration: none; text-transform: none; scrollbar-arrow-color: 000000; scrollbar-face-color: E777FF; scrollbar-3dlight-color: FF47A4; scrollbar-highlight-color: E777FF; scrollbar-darkshadow-color: 000000; scrollbar-shadow-color: FF47A4; scrollbar-track-color: E777FF; } body { scrollbar-arrow-color: 000000; scrollbar-face-color: E777FF; scrollbar-3dlight-color: FF47A4; scrollbar-highlight-color: E777FF; scrollbar-darkshadow-color: 000000; scrollbar-shadow-color: FF47A4; scrollbar-track-color: E777FF; background-image:url(http://www.myfilestash.com/userfiles/crystalp138/backgroundofunk.gif); background-position: top left; background-repeat: repeat; background-attachment: fixed; background-color:000000; } .head { color: #970149; border-bottom: 1px dashed #afadb0; font-family: trebuchet ms; font-size: 15pt; font-weight: bold; text-align: right; text-transform: lowercase; letter-spacing: -1px; padding: 0px 0 0px 2px; line-height: 15pt; margin-bottom: -15px; } .title { font-family: trebuchet ms; font-size: 8px; letter-spacing: 3px; line-spacing:7px; color:000000; border-bottom: 2px solid #000000; align:right; text-transform:uppercase; } .nav { font-size: 15pt; font-weight: bold; font-family: trebuchet ms; color: 000000; background-color: transparent; text-align: center; margin-bottom: 0px; } .welcome { font-size: 15pt; font-weight: bold; font-family: trebuchet ms; color: 970149; letter-spacing: -1px; background-color: #; text-align: right; text-transform: lowercase; padding: 0px 0 0px 2px; } blockquote{ background-color: #E5D4DF; border: 2px dotted #000000; color: #000000; padding: 5px;} b{ color: #a02659; } i{ color: #976c84; } u{ color: #000000; border-bottom: 1px dashed #000000; } --> </style> <noembed><body></noembed> <script> function changeNavigation(id) {document.getElementById('navi').innerHTML=document.getElementById(id).innerHTML} </script> </head> <img style="position: absolute; top: 15; left: 665;" border="0" src="http://www.myfilestash.com/userfiles/crystalp138/sidebarstuff.gif" width="343" height="561" usemap="#Map1"> <map id="Map1" name="Map1"> <AREA SHAPE=”rect” COORDS="79,41,270,67" name=”apparel" alt="apparel" onClick="changeNavigation('apparel')" title="apparel"> <AREA SHAPE=”rect” COORDS="68,81,273,169" name="posters" alt="posters" onClick="changeNavigation('posters')" title="posters"> <AREA SHAPE=”rect” COORDS="80,180,262,228" name= "decor" alt="decor" onClick="changeNavigation('decor')" title=”decor"> <AREA SHAPE=”rect” COORDS="85,236,265,286" name="cards" alt="cards" onClick="changeNavigation('cards')" title="cards"> <AREA SHAPE=”rect” COORDS="56,295,293,391" name="buttons" alt="buttons" onClick="changeNavigation('buttons')" title="buttons"> <AREA SHAPE=”rect” COORDS="40,396,316,457" name="misc" alt="misc" onClick="changeNavigation('misc')" title="misc"> <AREA SHAPE=”rect” COORDS="51,473,144,516" name="homie" alt="homie" onClick="changeNavigation('homie')" title="homie"> <AREA SHAPE=”rect” COORDS="169,474,297,519" name="contact" alt="contact" onClick="changeNavigation('contact')" title="contact"> </MAP> <div id="apparel" style="display:none;"> <p class=nav>Apparel</p> <img src="http://tn3-2.deviantart.com/fs18/300W/f/2007/127/0/5/explosions_of_the_mind_by_humanponygirl213.jpg" align="left"> <div id=layer2 style="position:absolute; top:40; left:360; width:339; height:562; z-index:2; padding:0px; border: none; background-color:; background-image:url(); layer-background-image:url();overflow:auto;"> <center> <br> <br> <a href=”http://www.zazzle.com/products/product/product.asp?cn=238260535297566018&product_id=228260742293327094”><img width=”109” height=”89” src=”http://i55.photobucket.com/albums/g136/crystal138/TheStuff/tl-explosionsofthemindposter.jpg” border=”0”></a> <br> <a href=”http://www.zazzle.com/products/product/product.asp?cn=238260535297566018&product_id=228260742293327094”>16”x11” Poster (customizable)</a> <br> <br> <a href=”http://www.zazzle.com/crystalp138/product/149675316301886038”><img src=”http://i55.photobucket.com/albums/g136/crystal138/TheStuff/tl-explosionsofthemindbag.jpg” width=”109” height=”89” border=”0”></a> <br> <a href=”http://www.zazzle.com/crystalp138/product/149675316301886038”>Bag (customizable)</a> <br> <br> <a href=”http://www.zazzle.com/crystalp138/product/144339565801842003”><img src=”http://i55.photobucket.com/albums/g136/crystal138/TheStuff/tl-explosionsmousepad.jpg” width=”109” height=”89” border=”0”></a> <br> <a href=”http://www.zazzle.com/crystalp138/product/144339565801842003”>Mousepad (customizable)</a> <br> <br> <a href=”http://www.zazzle.com/crystalp138/product/239257336799084498?idx=11&dt=&request=productSearch&term=&page=1&numRecsPerpage=20&sortBy=date_created&sortOrder=desc&sortPeriod=0&zidCategoryId=0&maturity=1&zidContributorId=238260535297566018&zcdProductType=0”><img src=”http://i55.photobucket.com/albums/g136/crystal138/TheStuff/tl-explosions.postcards.jpg” width=”109” height=”89” border=”0”></a> <br> <a href=”http://www.zazzle.com/crystalp138/product/239257336799084498?idx=11&dt=&request=productSearch&term=&page=1&numRecsPerpage=20&sortBy=date_created&sortOrder=desc&sortPeriod=0&zidCategoryId=0&maturity=1&zidContributorId=238260535297566018&zcdProductType=0”>Postcards (customizable)</a> <br> <br> <a href=”http://www.zazzle.com/crystalp138/product/146748128933268609?idx=1&dt=&request=productSearch&term=&page=1&numRecsPerpage=20&sortBy=date_created&sortOrder=desc&sortPeriod=0&zidCategoryId=0&maturity=1&zidContributorId=238260535297566018&zcdProductType=0”><img src=”http://i55.photobucket.com/albums/g136/crystal138/TheStuff/tl-explosionsofthemindkeychain.jpg” width=”109” height=”89” border=”0”></a> <br> <a href=”http://www.zazzle.com/crystalp138/product/146748128933268609?idx=1&dt=&request=productSearch&term=&page=1&numRecsPerpage=20&sortBy=date_created&sortOrder=desc&sortPeriod=0&zidCategoryId=0&maturity=1&zidContributorId=238260535297566018&zcdProductType=0”>Keychain (customizable)</a> <br> <br> <a href=””><img src=”” width=”109” height=”89” border=”0”></a> <a href=””>16”x11” Poster</a> <br> </center> </div> </p> </div> <div id="posters" style="display:none;"> <p class=nav>Posters</p> <center> <p> <img src="http://tn3-1.deviantart.com/fs17/300W/f/2007/127/e/0/outlandish_by_humanponygirl213.jpg" align="left"> <div id=layer2 style="position:absolute; top:40; left:360; width:339; height:562; z-index:2; padding:0px; border: none; background-color:; background-image:url(); layer-background-image:url();overflow:auto;"> <center> DA---Prints (lustre, matte, glossy), mugs, magnets, Lustre Prints 3.5x5 Inch Print $1.19 5x5 Inch Print $2.29 4x5 Inch Print $2.49 4x6 Inch Print $2.49 4x8 Inch Print $2.99 5x7 Inch Print $3.49 <a href="http://www.deviantart.com/print/1005323/step2">Buy This</a> Matte Prints 3.5x5 Inch Print $1 4x6 Inch Print $1.95 4x5 Inch Print $1.95 5x5 Inch Print $1.95 4x8 Inch Print $2.49 5x7 Inch Print $2.95 <a href="http://www.deviantart.com/print/1005323/step2">Buy This</a> Glossy Prints 3.5x5 Inch Print $1 4x5 Inch Print $1.95 5x5 Inch Print $1.95 4x6 Inch Print $1.95 4x8 Inch Print $2.49 5x7 Inch Print $2.95 <a href="http://www.deviantart.com/print/1005323/step2">Buy This</a> Mug 11 oz White Mug $10.95 11 oz Black Mug $12.48 15 oz White Mug $12.95 <a href="http://www.deviantart.com/print/1005323/mug">Buy This</a> Magnet Small Magnet $4.95 Large Magnet $6.95 <a href="http://www.deviantart.com/print/1005323/magnet">Buy This</a> </center> </div> </center> </p> </div> <div id="Decor" style="display:none;"> <p class=nav>Decor</p> <p> <img src="http://tn3-1.deviantart.com/fs18/300W/f/2007/127/3/3/lost_in_space_by_humanponygirl213.jpg" align="left"> <div id=layer2 style="position:absolute; top:40; left:360; width:339; height:562; z-index:2; padding:0px; border: none; background-color:; background-image:url(gif); layer-background-image:url();overflow:auto;"> <center> DA---Prints (lustre, matte, glossy), mugs, magnets, Lustre Prints 3.5x5 Inch Print $1.19 5x5 Inch Print $2.29 4x5 Inch Print $2.49 4x6 Inch Print $2.49 4x8 Inch Print $2.99 5x7 Inch Print $3.49 <a href="http://www.deviantart.com/print/1005323/step2">Buy This</a> Matte Prints 3.5x5 Inch Print $1 4x6 Inch Print $1.95 4x5 Inch Print $1.95 5x5 Inch Print $1.95 4x8 Inch Print $2.49 5x7 Inch Print $2.95 <a href="http://www.deviantart.com/print/1005323/step2">Buy This</a> Glossy Prints 3.5x5 Inch Print $1 4x5 Inch Print $1.95 5x5 Inch Print $1.95 4x6 Inch Print $1.95 4x8 Inch Print $2.49 5x7 Inch Print $2.95 <a href="http://www.deviantart.com/print/1005323/step2">Buy This</a> Mug 11 oz White Mug $10.95 11 oz Black Mug $12.48 15 oz White Mug $12.95 <a href="http://www.deviantart.com/print/1005323/mug">Buy This</a> Magnet Small Magnet $4.95 Large Magnet $6.95 <a href="http://www.deviantart.com/print/1005323/magnet">Buy This</a> </center> </div> </p> </div> <div id="Cards" style="display:none;"> <p class=nav>Cards</p> <img src="http://tn3-2.deviantart.com/fs17/300W/f/2007/127/e/e/geraldine_by_humanponygirl213.jpg" align="left"><p> <div id=layer2 style="position:absolute; top:40; left:360; width:339; height:562; z-index:2; padding:0px; border: none; background-color:; background-image:url(); layer-background-image:url();overflow:auto;"> <center> DA---Prints (lustre, matte, glossy), mugs, magnets, Lustre Prints 3.5x5 Inch Print $1.19 5x5 Inch Print $2.29 4x5 Inch Print $2.49 4x6 Inch Print $2.49 4x8 Inch Print $2.99 5x7 Inch Print $3.49 <a href="http://www.deviantart.com/print/1005323/step2">Buy This</a> Matte Prints 3.5x5 Inch Print $1 4x6 Inch Print $1.95 4x5 Inch Print $1.95 5x5 Inch Print $1.95 4x8 Inch Print $2.49 5x7 Inch Print $2.95 <a href="http://www.deviantart.com/print/1005323/step2">Buy This</a> Glossy Prints 3.5x5 Inch Print $1 4x5 Inch Print $1.95 5x5 Inch Print $1.95 4x6 Inch Print $1.95 4x8 Inch Print $2.49 5x7 Inch Print $2.95 <a href="http://www.deviantart.com/print/1005323/step2">Buy This</a> Mug 11 oz White Mug $10.95 11 oz Black Mug $12.48 15 oz White Mug $12.95 <a href="http://www.deviantart.com/print/1005323/mug">Buy This</a> Magnet Small Magnet $4.95 Large Magnet $6.95 <a href="http://www.deviantart.com/print/1005323/magnet">Buy This</a> </center> </div> </p> </div> <div id="buttons" style="display:none;"> <p class=nav>Buttons n Keychains</p> <img src="http://tn3-2.deviantart.com/fs18/300W/f/2007/127/5/8/crazy_trip_by_humanponygirl213.jpg" align="left"> <div id=layer2 style="position:absolute; top:40; left:360; width:339; height:562; z-index:2; padding:0px; border: none; background-color:; background-image:url(); layer-background-image:url();overflow:auto;"> <center> DA---Prints (lustre, matte, glossy), mugs, magnets, Lustre Prints 3.5x5 Inch Print $1.19 5x5 Inch Print $2.29 4x5 Inch Print $2.49 4x6 Inch Print $2.49 4x8 Inch Print $2.99 5x7 Inch Print $3.49 <a href="http://www.deviantart.com/print/1005323/step2">Buy This</a> Matte Prints 3.5x5 Inch Print $1 4x6 Inch Print $1.95 4x5 Inch Print $1.95 5x5 Inch Print $1.95 4x8 Inch Print $2.49 5x7 Inch Print $2.95 <a href="http://www.deviantart.com/print/1005323/step2">Buy This</a> Glossy Prints 3.5x5 Inch Print $1 4x5 Inch Print $1.95 5x5 Inch Print $1.95 4x6 Inch Print $1.95 4x8 Inch Print $2.49 5x7 Inch Print $2.95 <a href="http://www.deviantart.com/print/1005323/step2">Buy This</a> Mug 11 oz White Mug $10.95 11 oz Black Mug $12.48 15 oz White Mug $12.95 <a href="http://www.deviantart.com/print/1005323/mug">Buy This</a> Magnet Small Magnet $4.95 Large Magnet $6.95 <a href="http://www.deviantart.com/print/1005323/magnet">Buy This</a> </center> </div> </p> </div> <div id="misc" style="display:none;"> <p class=nav>Miscellaneous</p> <p> <img src="http://tn3-1.deviantart.com/fs18/300W/f/2007/127/7/3/vertigo_by_humanponygirl213.jpg" align="left"> <div id=layer2 style="position:absolute; top:40; left:360; width:339; height:562; z-index:2; padding:0px; border: none; background-color:; background-image:url(); layer-background-image:url();overflow:auto;"> <center> DA---Prints (lustre, matte, glossy), mugs, magnets, Lustre Prints 3.5x5 Inch Print $1.19 5x5 Inch Print $2.29 4x5 Inch Print $2.49 4x6 Inch Print $2.49 4x8 Inch Print $2.99 5x7 Inch Print $3.49 <a href="http://www.deviantart.com/print/1005323/step2">Buy This</a> Matte Prints 3.5x5 Inch Print $1 4x6 Inch Print $1.95 4x5 Inch Print $1.95 5x5 Inch Print $1.95 4x8 Inch Print $2.49 5x7 Inch Print $2.95 <a href="http://www.deviantart.com/print/1005323/step2">Buy This</a> Glossy Prints 3.5x5 Inch Print $1 4x5 Inch Print $1.95 5x5 Inch Print $1.95 4x6 Inch Print $1.95 4x8 Inch Print $2.49 5x7 Inch Print $2.95 <a href="http://www.deviantart.com/print/1005323/step2">Buy This</a> Mug 11 oz White Mug $10.95 11 oz Black Mug $12.48 15 oz White Mug $12.95 <a href="http://www.deviantart.com/print/1005323/mug">Buy This</a> Magnet Small Magnet $4.95 Large Magnet $6.95 <a href="http://www.deviantart.com/print/1005323/magnet">Buy This</a> </center> </div> </p> </div> <div id="homie" style="display:none;"> <p class=nav>♥</p> <p> <img src="http://tn3-2.deviantart.com/fs16/300W/f/2007/127/b/9/strange_daze_by_humanponygirl213.jpg" align="left"> <div id=layer2 style="position:absolute; top:40; left:360; width:339; height:562; z-index:2; padding:0px; border: none; background-color:; background-image:url(); layer-background-image:url();overflow:auto;"> <center> DA---Prints (lustre, matte, glossy), mugs, magnets, Lustre Prints 3.5x5 Inch Print $1.19 5x5 Inch Print $2.29 4x5 Inch Print $2.49 4x6 Inch Print $2.49 4x8 Inch Print $2.99 5x7 Inch Print $3.49 <a href="http://www.deviantart.com/print/1005323/step2">Buy This</a> Matte Prints 3.5x5 Inch Print $1 4x6 Inch Print $1.95 4x5 Inch Print $1.95 5x5 Inch Print $1.95 4x8 Inch Print $2.49 5x7 Inch Print $2.95 <a href="http://www.deviantart.com/print/1005323/step2">Buy This</a> Glossy Prints 3.5x5 Inch Print $1 4x5 Inch Print $1.95 5x5 Inch Print $1.95 4x6 Inch Print $1.95 4x8 Inch Print $2.49 5x7 Inch Print $2.95 <a href="http://www.deviantart.com/print/1005323/step2">Buy This</a> Mug 11 oz White Mug $10.95 11 oz Black Mug $12.48 15 oz White Mug $12.95 <a href="http://www.deviantart.com/print/1005323/mug">Buy This</a> Magnet Small Magnet $4.95 Large Magnet $6.95 <a href="http://www.deviantart.com/print/1005323/magnet">Buy This</a> </center> </div> </p> </div> <div id="contact" style="display:none;"> <p class=nav>Contact Me.</p> <p> <img src="http://tn3-1.deviantart.com/fs17/300W/f/2007/127/0/2/lost_in_a_forest_of_thought_by_humanponygirl213.jpg" align="left"> <div id=layer2 style="position:absolute; top:40; left:360; width:339; height:562; z-index:2; padding:0px; border: none; background-color:; background-image:url(); layer-background-image:url();overflow:auto;"> <center> <a href="mailto:crystalp138@comcast.net">crystalp138@comcast.net</a> <a href="http://www.myspace.com/_thestuff">The Stuff on Myspace</a> <a href="http://www.myspace.com/humanponygirl213">My Personal Myspace</a> </center> </div> </p> </div> <div id="navi" style="position:absolute; width:650; height:430; z-index:4; left: 55px; top: 145px; overflow: auto; filter: none; background-color:transparent"> <center> <p class=home></p> <p align=center> <p class=nav>♥ About moi ♥</p> <p> <img src="http://tn1-2.pv.deviantart.com/fs18/150/f/2007/127/0/5/explosions_of_the_mind_by_humanponygirl213.jpg" align="left"> <center> blah blah abunch of stuff here blah blah </center> </p> </b></font color><br> </center> </div> </body> </html> |
|
|
|
Posts in this topic
  |
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members: