1,105,556 Community Members

Shadow boxes and image mappings

Member Avatar
Waldema
Newbie Poster
10 posts since Jan 2012
Reputation Points: 0 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
0
 

Hi!

I'm building website of my own and got a little problem.

My home.php is based on image, which contains certain areas to be links to the other areas. I'm trying to use <map> and <area> elements creating the links. Basically code is working just fine, but when I added the feature that makes "the other areas" open up in a Shadow box over the home.php problems started to appear.

First of all in the image there are 4 spots which I want to work as links. And one of them is Log Out link. So I need 3 of them open up in Shadow box and the log out link should act as a normal link.

Problem is now that I've managed to get the links I want to open up in Shadow box work, but also the log out link opens up in Shadow box and onclick it shows the log in page.

Because of the <map> and <area> tags, I can't use Shadow box in a regular way with "rel=" attribute. I've configured it like this:

<script type="text/javascript">
Shadowbox.init();

window.onload = function() {
    Shadowbox.setup(document.getElementById("links").getElementsByTagName("area"));
}
</script>

and my <map> element looks like this:

<map name="links" id="links">
  <area id="links" shape="rect" coords="6,261,87,314" href="a.php">
  <area id="links" shape="rect" coords="8,336,280,381" href="b.php">
  <area id="links" shape="rect" coords="5,402,177,458" href="c.php">
  <area shape="rect" coords="713,1,901,47" href="logout.php">
</map>

Still somehow despite of row

"Shadowbox.setup(document.getElementById("[B]links[/B]").getElementsByTagName("[B]area[/B]"));

logout.php opens in Shadow box. Could somebody help me with this?

Is there a better or alternative way to do this? Without Shadow box with still same efect?

E:Is it possible to create multiple <map> elements in one picture? Just got a thought if I create separate <map>s for the 3 other links and one very own for the log out link.

^ So far can't get this working. Maybe theres not support for that.

Member Avatar
jackbauer24
Posting Whiz in Training
243 posts since Oct 2011
Reputation Points: 0 [?]
Q&As Helped to Solve: 5 [?]
Skill Endorsements: 0 [?]
 
0
 

You better solve the thread 'cause nobody is replying(no offense).

You
This article has been dead for over three months: Start a new discussion instead
Post:
Start New Discussion
View similar articles that have also been tagged: