Getting it to work and linking to hotspots
Locked
Getting it to work and linking to hotspots
 
|
Hi Folks,
I am VERY new to shadowbox and I am trying to do 2 things. 1 - Make sure I have the setup right - is there a simple directory structure I should follow. 2 - Linking to Dreamweaver hotspots. - Is this possible and can someone tell me how to do it. This is the page.... http://www.cuelk.com/newsite/profiles2.html This is the source code <html> <head> <title>Cuelk Profiles</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <script type="text/javascript" src="shadow/src/shadowbox-base.js"></script><script type="text/javascript" src="shadow/src/shadowbox.js"></script><script type="text/javascript"> Shadowbox.loadSkin('classic', 'shadow/src/skin'); Shadowbox.loadLanguage('en', 'shadow/src/lang'); Shadowbox.loadPlayer(['flv', 'html', 'iframe', 'img', 'qt', 'swf', 'wmp'], 'shadowbox/player'); window.onload = Shadowbox.init; </script> <center> <body bgcolor="#000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<map name="Map"><area shape="rect" coords="143,299,198,384" href="http://cuelk.bebo.com" rel="shadowbox> <area shape="rect" coords="213,253,266,339" href="#" alt="Davy Dee"> <area shape="rect" coords="296,243,352,333" href="#" alt="Eddie"> <area shape="rect" coords="384,242,449,334" href="#" alt="Justice Junior"> <area shape="rect" coords="473,249,534,328" href="#" alt="Conor D"> <area shape="rect" coords="554,248,613,333" href="#" alt="Gavin"> <area shape="rect" coords="616,298,675,394" href="#" alt="Ciaran"> <area shape="rect" coords="207,363,266,444" href="#" alt="Bernard"> <area shape="rect" coords="290,364,355,442" href="#" alt="Chin"> <area shape="rect" coords="386,361,522,445" href="#" alt="House Arrest"> <area shape="rect" coords="550,362,596,433" href="#"></map></body></center> </html> The plan is that when they click on a head a full size pic would open up with the DJ's biog Sorry but I really don't have a clue and I would love to get this working on this site. Joe |
Re: Getting it to work and linking to hotspots
|
|
Re: Getting it to work and linking to hotspots
|
|
In reply to this post by hunterjo2
Here is the source code example to make this work for one or many hotspots on a page. Check out http://www.mobile-pc-repair.com for a working example.
<!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>Your Title Goes Here</title> <link rel="stylesheet" type="text/css" href="shadowbox.css"> <script type="text/javascript" src="shadowbox.js"></script><script type="text/javascript"> Shadowbox.init({ players: ['iframe'] }); </script> <script type="text/javascript"> function loadPage1(){ Shadowbox.open({ player: 'iframe', content: 'http://www.your_web_address.com/page1.html', height: 480, width: 640, title: 'Directions' }); }; </script> <script type="text/javascript"> function loadPage2(){ Shadowbox.open({ player: 'iframe', content: 'http://www.your_web_address.com/page2.html', height: 480, width: 640, title: 'Products' }); }; </script> <script type="text/javascript"> function loadPage3(){ Shadowbox.open({ player: 'iframe', content: 'http://www.your_web_address.com/page3.html', height: 480, width: 640, title: 'Services' }); }; </script> <script type="text/javascript"> function loadPage4(){ Shadowbox.open({ player: 'iframe', content: 'http://www.your_web_address.com/page4.html', height: 480, width: 640, title: 'Training Classes' }); }; </script></head> <body> <div align="center">  </div> <map name="Map" id="Map"> <area title="Page1" shape="rect" coords="54,50,140,72" href="#" onclick="loadPage1(); return false;" /> <area title="Page2" shape="rect" coords="61,85,137,103" href="#" onclick="loadPage2(); return false;" /> <area title="Page3" shape="rect" coords="67,120,131,137" href="#" onclick="loadPage3(); return false;" /> <area title="Page4" shape="rect" coords="36,151,160,169" href="#" onclick="loadPage4(); return false;" /> </map> </body> </html> |
| Free forum by Nabble | Edit this page |