Sidebar Sidebar
Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

"Named Anchor" Hack/Workaround for Safari??

DesignIt said:
I guess I am at a loss then because I am not aware of the 2 ID's you are referring to.

:confused:

edit: I am using this version of Safari: 1.3.1 (v312.3.3)
Click to expand...

The older version of safari could be the problem. Try this:

http://mac.7motion.com/software.php#desktop

Does that link automatically anchor you to the correct section or does it stay at the top? It works for me in Safari v2.0.2. If not, then it must be a safari (version) issue.
 
radiantm3 said:
Yes, that is correct. Which means it does work. :)
Click to expand...

Ha haa, and all that time I was looking for a link under Evocam for the Safari update. lol
 
So these don't work in 1.3? Can nothing be done?

First, that link didn't work in Safari 1.3.

Second, I'd like to clarify the problem a bit:

I have some anchor tags (the <a name='something'> kind) that are inside of a div section. When I click a link on a page (that's within the same div section) which points to the named anchor tag, it doesn't just scroll the document horizontally so that the named anchor is at the top of the div section. It moves the entire div section so that named anchor is at the top left of the entire browser window, shifting my entire page up and to the left, so that elements that were to the left of the div section are no longer visible.

I'd like to be able to support those who are not yet on Tiger and can't use Safari 2. Is there any way to do this???
 
Hi. Sorry to cont. this
But I just don’t get it. I do not know anything about making web pages, but I’m doing in anywho. Did this fantastic page www.solarmassacre.dk
But just can’t get the anchors to work in safari. I’ve created the page in Dreamweaver.

have no idea how much of the code you want so here is everything:

<!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>SOLARMASSACRE</title>
<style type="text/css">
<!--
body,td,th {
color: #000000;
}
body {
background-color: #000000;
}
#apDiv1 {
position:absolute;
left:172px;
top:95px;
width:173px;
height:137px;
z-index:10;
}
#apDiv2 {
position:absolute;
left:109px;
top:1431px;
width:127px;
height:123px;
z-index:2;
}
#apDiv3 {
position:absolute;
left:314px;
top:711px;
width:100px;
height:114px;
z-index:3;
}
#apDiv4 {
position:absolute;
left:78px;
top:-67px;
width:100px;
height:86px;
z-index:4;
}
#apDiv5 {
position:absolute;
left:387px;
top:1714px;
width:259px;
height:218px;
z-index:5;
}
#apDiv6 {
position:absolute;
left:45px;
top:3220px;
width:228px;
height:1077px;
z-index:11;
}
#apDiv7 {
position:absolute;
left:373px;
top:4310px;
width:264px;
height:284px;
z-index:12;
}
#apDiv8 {
position:absolute;
left:379px;
top:2777px;
width:39px;
height:40px;
z-index:13;
}
#apDiv9 {
position:absolute;
left:336px;
top:2756px;
width:25px;
height:21px;
z-index:14;
}
#apDiv10 {
position:absolute;
left:294px;
top:5846px;
width:48px;
height:28px;
z-index:15;
}
#apDiv11 {
position:absolute;
left:519px;
top:2756px;
width:58px;
height:56px;
z-index:16;
}
#apDiv12 {
position:absolute;
left:726px;
top:140px;
width:214px;
height:312px;
z-index:17;
}
.style1 {
font-family: "Times New Roman", Times, serif;
font-size: 14px;
}
#apDiv13 {
position:absolute;
left:729px;
top:181px;
width:480px;
height:72px;
z-index:18;
}
#apDiv14 {
position:absolute;
left:398px;
top:1740px;
width:23px;
height:22px;
z-index:18;
}
#apDiv15 {
position:absolute;
left:9px;
top:3217px;
width:18px;
height:24px;
z-index:19;
}
#apDiv16 {
position:absolute;
left:577px;
top:2253px;
width:165px;
height:40px;
z-index:20;
}
#apDiv17 {
position:absolute;
left:4px;
top:0px;
width:33px;
height:15px;
z-index:21;
}
#apDiv18 {
position:absolute;
left:407px;
top:5826px;
width:36px;
height:34px;
z-index:22;
}
#apDiv19 {
position:absolute;
left:173px;
top:6036px;
width:209px;
height:35px;
z-index:23;
}
#apDiv20 {
position:absolute;
left:851px;
top:5443px;
width:142px;
height:45px;
z-index:24;
}
#apDiv21 {
position:absolute;
left:698px;
top:4240px;
width:207px;
height:55px;
z-index:25;
}
#apDiv22 {
position:absolute;
left:756px;
top:3187px;
width:140px;
height:54px;
z-index:26;
}
#apDiv23 {
position:absolute;
left:384px;
top:5487px;
width:42px;
height:48px;
z-index:27;
}
#apDiv24 {
position:absolute;
left:714px;
top:2665px;
width:59px;
height:20px;
z-index:28;
}
#apDiv25 {
position:absolute;
left:45px;
top:3975px;
width:83px;
height:16px;
z-index:29;
}
#apDiv26 {
position:absolute;
left:71px;
top:814px;
width:49px;
height:17px;
z-index:30;
}
#apDiv27 {
position:absolute;
left:415px;
top:2402px;
width:64px;
height:56px;
z-index:31;
}
#apDiv28 {
position:absolute;
left:592px;
top:2503px;
width:458px;
height:51px;
z-index:32;
}
#apDiv29 {
position:absolute;
left:618px;
top:2571px;
width:113px;
height:36px;
z-index:33;
}
#apDiv30 {
position:absolute;
left:375px;
top:2405px;
width:23px;
height:25px;
z-index:34;
}
.style12 {color: #FFFFFF}
.style13 {
font-family: "Times New Roman", Times, serif;
color: #FFFFFF;
font-size: 24px;
font-weight: bold;
}
#apDiv31 {
position:absolute;
left:26px;
top:1483px;
width:66px;
height:74px;
z-index:35;
}
#apDiv32 {
position:absolute;
left:168px;
top:1614px;
width:273px;
height:53px;
z-index:36;
}
#apDiv33 {
position:absolute;
left:395px;
top:648px;
width:30px;
height:41px;
z-index:37;
}
#apDiv34 {
position:absolute;
left:29px;
top:1482px;
width:21px;
height:22px;
z-index:38;
}
#apDiv35 {
position:absolute;
left:442px;
top:644px;
width:22px;
height:23px;
z-index:39;
}
#apDiv36 {
position:absolute;
left:854px;
top:1412px;
width:122px;
height:38px;
z-index:40;
}
#apDiv37 {
position:absolute;
left:247px;
top:1709px;
width:38px;
height:28px;
z-index:41;
}
#apDiv38 {
position:absolute;
left:48px;
top:-6px;
width:19px;
height:15px;
z-index:42;
}
#apDiv39 {
position:absolute;
left:361px;
top:5833px;
width:29px;
height:25px;
z-index:43;
}
#apDiv40 {
position:absolute;
left:13px;
top:5828px;
width:24px;
height:23px;
z-index:44;
}
-->
</style>
<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
</head>

<body>
<div id="apDiv1"><img src="billeder/index.jpg" alt="SOL is Emil Brahe" width="682" height="478" border="0" /></div>
<div id="apDiv4"><img src="billeder/top.JPG" width="1012" height="182" alt="The Official SOL Site" longdesc="http://www.solarmassacre.dk" /></div>
<div id="apDiv5"><img src="news131008.gif" alt="news 10 13 08" width="535" height="591" /></div>
<div id="apDiv6"><img src="billeder/ltbamlyric1.GIF" alt="Let there be a massacre lyrics 1" width="596" height="1062" /></div>
<div id="apDiv7"><img src="billeder/ltbamlyric2.gif" alt="Let there be a massacre lyrics 2" width="678" height="1180" /></div>
<div id="apDiv8"><img src="billeder/ltbam.jpg" alt="Let There Be A Massacre" width="130" height="130" border="0" usemap="#Map5" />
<map name="Map5" id="Map5"><area shape="rect" coords="37,39,102,98" href="#oettinger" />
</map></div>
<div id="apDiv9"><a name="ltbam" id="ltbam"></a></div>
<div id="apDiv11"><img src="billeder/ltbamtracklist.gif" alt="Let There Be A Massacre Track List" width="325" height="461" /></div>
<div class="style1" id="apDiv12">
<p><img src="billeder/content.gif" alt="The Official Sol Site" width="289" height="465" border="0" usemap="#Map" />
<map name="Map" id="Map">
<area shape="rect" coords="68,103,227,125" href="#news101308" />
<area shape="rect" coords="22,270,266,292" href="#ltbamlyrics" />
<area shape="rect" coords="22,343,263,364" href="#ltbam" /><area shape="rect" coords="69,80,225,103" href="#news101508" alt="news 10 15 08" /><area shape="rect" coords="61,174,228,194" href="#viljentilkamp" alt="Viljen Til Kamp" />
<area shape="rect" coords="92,390,197,420" href="#con" />
<area shape="rect" coords="68,194,224,220" href="#abyss" />
</map></p>
</div>
<div id="apDiv14"><a name="news101308" id="news101308"></a></div>
<div id="apDiv15"><a name="ltbamlyrics" id="ltbamlyrics"></a></div>
<div id="apDiv16"><img src="billeder/tothetop.gif" alt="to the top" width="100" height="25" border="0" usemap="#Map2" />
<map name="Map2" id="Map2"><area shape="rect" coords="-4,-6,141,24" href="#front" />
</map></div>
<div id="apDiv17"><a name="front" id="front"></a></div>
<div id="apDiv18"><img src="billeder/contact.gif" alt="contact" width="590" height="473" /></div>
<div id="apDiv19">
<map name="Map2Map" id="Map2Map">
<area shape="rect" coords="-4,-6,141,24" href="#front" />
</map>
<map name="Map2Map2" id="Map2Map2">
<area shape="rect" coords="-4,-6,141,24" href="#front" />
</map>
<img src="billeder/tothetop.gif" alt="to the top" width="100" height="25" border="0" usemap="#Map2Map3" />
<map name="Map2Map3" id="Map2Map3">
<area shape="rect" coords="-14,-4,131,26" href="#front" />
</map>
</div>
<div id="apDiv20"><img src="billeder/tothetop.gif" alt="to the top" width="100" height="25" border="0" usemap="#Map2Map4" />
<map name="Map2Map4" id="Map2Map4">
<area shape="rect" coords="-4,-6,141,24" href="#front" />
</map>
</div>
<div id="apDiv21"><img src="billeder/tothetop.gif" alt="to the top" width="100" height="25" border="0" usemap="#Map2Map5" />
<map name="Map2Map5" id="Map2Map5">
<area shape="rect" coords="-4,-6,141,24" href="#front" />
</map>
</div>
<div id="apDiv22"><img src="billeder/tothetop.gif" alt="to the top" width="100" height="25" border="0" usemap="#Map2Map6" />
<map name="Map2Map6" id="Map2Map6">
<area shape="rect" coords="-4,-6,141,24" href="#front" />
</map>
</div>
<div id="apDiv23"><img src="billeder/Sol1.gif" alt="Emil Brahe Smoking" width="618" height="339" /></div>
<div id="apDiv27"><img src="billeder/musik/iabys.JPG" alt="Abyss Of Light" width="573" height="159" /></div>
<div class="style12" id="apDiv28"><img src="billeder/musik/play.GIF" alt="Play Abyss Of Light" width="206" height="28" border="0" usemap="#Map4" />
<map name="Map4" id="Map4"><area shape="rect" coords="3,-39,229,23" href="musik/abyss.html" target="_blank" alt="Play Abyss Of Light" />
</map> </div>
<div id="apDiv29"><img src="billeder/tothetop.gif" alt="to the top" width="100" height="25" border="0" usemap="#Map2Map10" />
<map name="Map2Map10" id="Map2Map10">
<area shape="rect" coords="-4,-6,141,24" href="#front" />
</map>
</div>
<div id="apDiv30"><a name="abyss" id="abyss"></a></div>
<div id="apDiv31"><img src="billeder/musik/iviljen.JPG" alt="viljen til kamp" width="559" height="206" /></div>
<div id="apDiv32"><img src="billeder/musik/play.GIF" alt="Play Viljen til kamp" width="206" height="28" border="0" usemap="#Map3" />
<map name="Map3" id="Map3"><area shape="rect" coords="3,-40,253,23" href="musik/viljen.html" target="_blank" alt="Play Viljen Til Kamp" />
</map> </div>
<div id="apDiv33"><img src="news101508.JPG" alt="news 10 15 08" width="636" height="813" /></div>
<div id="apDiv34"><a name="viljentilkamp" id="viljentilkamp"></a></div>
<div id="apDiv35"><a name="news101508" id="news101508"></a></div>
<div id="apDiv36"><img src="billeder/tothetop.gif" alt="to the top" width="100" height="25" border="0" usemap="#Map2Map7" />
<map name="Map2Map7" id="Map2Map7">
<area shape="rect" coords="-4,-6,141,24" href="#front" />
</map>
</div>
<div id="apDiv37"><img src="billeder/tothetop.gif" alt="to the top" width="100" height="25" border="0" usemap="#Map2Map8" />
<map name="Map2Map8" id="Map2Map8">
<area shape="rect" coords="-4,-6,141,24" href="#front" />
</map>
</div>
<div id="apDiv40"><a name="con" id="con"></a></div>
<div align="left"></div>
</body>
</html>
 
First, this probably should have been started as a new thread considering the original is from 2005. Second, go back and edit your post and put the HTML block around your code so it formats correctly (place "[ HTML ] YOUR HTML [ /HTML]" without the spaces).

I tried the site with Safari 3 and had no problems with the links. What version are you trying?
 
angelwatt said:
First, this probably should have been started as a new thread considering the original is from 2005. Second, go back and edit your post and put the HTML block around your code so it formats correctly (place "[ HTML ] YOUR HTML [ /HTML]" without the spaces).

I tried the site with Safari 3 and had no problems with the links. What version are you trying?
Click to expand...

well. i have nothing against the year 2005, even though it was a bad movie year. im using safari 3.1.2.
the links are "working" but not taking you the right places. for instance "to the top" should take you to the top.
Have no idea how to format the html the right way.
 
Man, this is old stuff.

Anyway, I welcome you to post your fix but I want to comment on the actual syntax requirements for named anchors by W3C standards.

1) The name attribute is cross browser compliant for DTD types HTML and transitional XHTML. ID should not be used because if DTD is HTML the ID will be ignored. In transitional XHTML the ID is technically in draft/unsupported status so it likely will work in most browsers, but you can't count on it!

If you assign the same value for ID and name with those DTDs be warned - some browsers will either ignore it or cause a conflict with existing properties in the document object.

2) The ID attribute is required in strict HTML. As a matter of fact, the name attribute is officially deprecated. So only use the ID in strict HTML, period.

Source: http://www.w3schools.com/TAGS/att_a_name.asp

-jim
 
You must log in or register to reply here.
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.
Top Bottom
Back