PDA

View Full Version : anchors wiht an image map, and iframes. HELP!!!!

Stacey
02-13-2004, 09:27 PM
Can someone please help me to put anchors in this code? It's for my web design class, so I need an answer really soon. Thanks!

<html>
<head>
<title>Your page title goes here</title>

<META name="description" content="stacey abfalter, sandra bullock, web design, school project, until now, boys don't cry, white oleander, i am sam, beaches, enough, liar liar, blue streak, butterfly effect, rush hour, rush hour 2">

<STYLE type="text/css">
<!--
BODY {
scrollbar-face-color: 000000;
scrollbar-highlight-color: 000000;
scrollbar-3dlight-color: ffffff;
scrollbar-darkshadow-color: ffffff;
scrollbar-shadow-color: 000000;
scrollbar-arrow-color: ffffff;
scrollbar-track-color: 000000;
}
-->
</STYLE>

<style type="text/css">
<!--
A:link{ text-decoration: none; color:#3A5172; cursor:crosshair;}
A:visited{ text-decoration:none; color:#3A5172; cursor:crosshair;}
A:active{ text-decoration:none; color:#3A5172; cursor:crosshair;}
A:hover{ text-decoration:none; color:#FFFFFF; font-weight:bold; cursor:crosshair;}
-->
</style>

</head>


<BODY BGCOLOR="black">
<DIV style="position: absolute; top:0px; left:1px">
<IMG SRC="sandra.jpg" WIDTH="604" HEIGHT="400">
</div>

<DIV style="position: absolute; top:401px; left:1px">

<img src="menu.jpg" alt="menu.jpg" usemap="#menu.jpg" style="border: 0;" />

<map name="menu.jpg">

<area shape="rect" coords="6,0,67,22" href="" target="" alt=""/>
<area shape="rect" coords="78,0,166,22" href="" target="" alt=""/>
<area shape="rect" coords="177,0,282,22" href="" target="" alt="" />
<area shape="rect" coords="298,0,364,22" href="" target="" alt="" />
<area shape="rect" coords="378,0,448,22" href="" target="" alt="" />
<area shape="rect" coords="461,0,587,22" href="" target="" alt="" />

</map>
</div>


<DIV style="position: absolute; top:0px; left:1005px;">
<IFRAME name="home" src="home.html" width=400 height=402 marginwidth=0 marginheight=0 hspace=0 vspace=0 frameborder=0 style="border: 2 solid #ffffff" scrolling="auto"></IFRAME>
</div>



<DIV style="position: absolute; top:0px; left:1705px;">
<IFRAME name="aboutme" src="aboutme.html" width=400 height=402 marginwidth=0 marginheight=0 hspace=0 vspace=0 frameborder=0 style="border: 2 solid #ffffff" scrolling="auto"></IFRAME>
</div>


<DIV style="position: absolute; top:0px; left:2405px;">
<IFRAME name="futureplans" src="futureplans.html" width=400 height=402 marginwidth=0 marginheight=0 hspace=0 vspace=0 frameborder=0 style="border: 2 solid #ffffff" scrolling="auto"></IFRAME>
</div>

<DIV style="position: absolute; top:0px; left:3105px;">
<IFRAME name="resume" src="resume.html" width=400 height=402 marginwidth=0 marginheight=0 hspace=0 vspace=0 frameborder=0 style="border: 2 solid #ffffff" scrolling="auto"></IFRAME>
</div>

<DIV style="position: absolute; top:0px; left:3805px;">
<IFRAME name="hobbies" src="hobbies.html" width=400 height=402 marginwidth=0 marginheight=0 hspace=0 vspace=0 frameborder=0 style="border: 2 solid #ffffff" scrolling="auto"></IFRAME>
</div>

<DIV style="position: absolute; top:0px; left:4505px;">
<IFRAME name="favmovies" src="favmovies.html" width=400 height=402 marginwidth=0 marginheight=0 hspace=0 vspace=0 frameborder=0 style="border: 2 solid #ffffff" scrolling="auto"></IFRAME>
</div>





</body>
</html>



You can visit the site at http://www.geocities.com/untilnow515.
MaGiCSuN
02-13-2004, 09:34 PM
this is what your image map should look like:


<DIV style="position: absolute; top:401px; left:1px">

<img src="menu.jpg" alt="menu.jpg" usemap="#menu.jpg" style="border: 0;" />

<map name="menu.jpg">

<area shape="rect" coords="6,0,67,22" href="#home" target="" alt=""/>
<area shape="rect" coords="78,0,166,22" href="#aboutme" target="" alt=""/>
<area shape="rect" coords="177,0,282,22" href="#futureplans" target="" alt="" />
<area shape="rect" coords="298,0,364,22" href="#resume" target="" alt="" />
<area shape="rect" coords="378,0,448,22" href="#hobbies" target="" alt="" />
<area shape="rect" coords="461,0,587,22" href="#favmovies" target="" alt="" />

</map>
</div>


also things you don't use (like target) can be deleted :)

Love,
Mirna
Rosey
02-13-2004, 09:45 PM
All your style stuff between your header tags, put all your stuff in one <style> tags. You can also put background-color:black in your css instead of the <body> tag.
Stacey
02-13-2004, 09:56 PM
this is what your image map should look like:


<DIV style="position: absolute; top:401px; left:1px">

<img src="menu.jpg" alt="menu.jpg" usemap="#menu.jpg" style="border: 0;" />

<map name="menu.jpg">

<area shape="rect" coords="6,0,67,22" href="#home" target="" alt=""/>
<area shape="rect" coords="78,0,166,22" href="#aboutme" target="" alt=""/>
<area shape="rect" coords="177,0,282,22" href="#futureplans" target="" alt="" />
<area shape="rect" coords="298,0,364,22" href="#resume" target="" alt="" />
<area shape="rect" coords="378,0,448,22" href="#hobbies" target="" alt="" />
<area shape="rect" coords="461,0,587,22" href="#favmovies" target="" alt="" />

</map>
</div>


also things you don't use (like target) can be deleted :)

Love,
Mirna
Stacey
02-13-2004, 09:59 PM
this is what your image map should look like:


<DIV style="position: absolute; top:401px; left:1px">

<img src="menu.jpg" alt="menu.jpg" usemap="#menu.jpg" style="border: 0;" />

<map name="menu.jpg">

<area shape="rect" coords="6,0,67,22" href="#home" target="" alt=""/>
<area shape="rect" coords="78,0,166,22" href="#aboutme" target="" alt=""/>
<area shape="rect" coords="177,0,282,22" href="#futureplans" target="" alt="" />
<area shape="rect" coords="298,0,364,22" href="#resume" target="" alt="" />
<area shape="rect" coords="378,0,448,22" href="#hobbies" target="" alt="" />
<area shape="rect" coords="461,0,587,22" href="#favmovies" target="" alt="" />

</map>
</div>


also things you don't use (like target) can be deleted :)

Love,
Mirna











Ok I got that, but I don't know exactly where to put the other part of the anchor code, because where I put it, right before the <IFRAME> tage, yeah it doesn't jump right to the edge of the "home frame" for example.
Rosey
02-13-2004, 10:27 PM
if you are trying to target those div layesr, just put target="name of frame" like for example

target="hobbies"
MaGiCSuN
02-13-2004, 11:10 PM
you allready have name="NAMEHERE" in your iframe tags, so with the part i have added to the image map it automatically jumps to it. Normally you have to put the Name="NAMHERE" part as a seperate tag in your webpage, but since you allready have that it isn't nessecary anymore

love,
Mirna