CharleyM
Posts: 1
Joined: Mon May 05, 2008 5:03 am

Don't use named anchor with same "name" as a div's

I had a problem that drove me crazy for a few hours and I thought I'd post this to save someone else some time.
I made an HTML file with a few divs and named anchors to supply good fallback behavior if JS was turned off. E.g.:

Code: Select all

<a name="topic1"></a><div id="topic1">...
for each content section to be display in a separate Highslide HTML popup via AJAX.
As usual, this works fine in Firefox, but there was no content displayed in any IE version.
The problem is that IE returns the <a> element instead of the <div> for the document.getElementById("topic1") call made by hs code to get the content to display. :evil:

There are 2 ways to get around this:
1. The simplest is to put the named anchor after the div in the file to read:

Code: Select all

 <div id="topic1"><a name="topic1"></a>...
2. If you really need to have the named anchor before the div, you should use different values for "name" and "id" and use the hs.src option:

Code: Select all

<a href ="myfile.html#_topic1"
          onclick="return hs.htmlExpand(this,
            { contentId: 'topic1',
              src: 'myfile.html#topic1',
              objectType: 'ajax', ...
            } )">Click Me</a>
and use

Code: Select all

<a name="_topic1"><div id="topic1"></a>

in myfile.html

Return to “Highslide JS Usage”