Title: Image maps &#8211; Use JAVA script?
Last modified: August 21, 2016

---

# Image maps – Use JAVA script?

 *  [asteadman](https://wordpress.org/support/users/asteadman/)
 * (@asteadman)
 * [13 years, 2 months ago](https://wordpress.org/support/topic/image-maps-use-java-script/)
 * I am creating a Virtual Tour of my School: [http://www.hollyhallacademy.co.uk/our-academy/virtual-tour/](http://www.hollyhallacademy.co.uk/our-academy/virtual-tour/)
 * I have created an image map:
 * <img class=”aligncenter size-full wp-image-559″ alt=”Holly-Hall-Virtual-Tour-
   Map” src=”[http://www.hollyhallacademy.co.uk/wp-content/uploads/2013/02/Holly-Hall-Virtual-Tour-Map.jpg&#8221](http://www.hollyhallacademy.co.uk/wp-content/uploads/2013/02/Holly-Hall-Virtual-Tour-Map.jpg&#8221);
   width=”980″ height=”656″ usemap=”#tour” border=”0″>
 * <map name=”tour”>
    <area shape=”rect” coords=”130,35,1,53″ href=”[http://www.dermandar.com/p/aSohmZ/t5&#8243](http://www.dermandar.com/p/aSohmZ/t5&#8243);
   target=”_blank”> </map>
 * My question is do you know what code I could use to launch the full size panoramic
   directly from the image map to make it easier for the user? The embed code offered
   by dermandar.com is as follows, however this will not do what I need:
 * <div id=”dmd_pano_ayrxLq” style=”width: 960px; height: 150px;”></div>
    <script
   type=”text/javascript”> var dmdEmbeds = dmdEmbeds || [], ayrxLq_w=’960′, ayrxLq_h
   =’738′; (function(){ dmdEmbeds.push(‘ayrxLq’);})(); </script> <script type=”text/
   javascript” src=”[http://static.dermandar.com/js/embed.js?v=94.84.65″></script&gt](http://static.dermandar.com/js/embed.js?v=94.84.65″></script&gt);
 * Thanks in advance for your help.

Viewing 4 replies - 1 through 4 (of 4 total)

 *  Moderator [bcworkz](https://wordpress.org/support/users/bcworkz/)
 * (@bcworkz)
 * [13 years, 2 months ago](https://wordpress.org/support/topic/image-maps-use-java-script/#post-3656415)
 * I’ve no idea what the dermandar.com stuff is doing. If you can launch a panoramic
   image by having javascript open an url, then you just need to add something like`
   onmousedown="launchPano(event)"` to your <img> tag.
 * Then in the function definition of `launchPano(event)` the coordinates clicked
   in the window are available as `event.clientX` and `event.clientY`, from that
   your code can determine which hotspot was clicked and open the corresponding 
   url.
 *  Thread Starter [asteadman](https://wordpress.org/support/users/asteadman/)
 * (@asteadman)
 * [13 years, 2 months ago](https://wordpress.org/support/topic/image-maps-use-java-script/#post-3656419)
 * Thanks for the feedback.
 * I cannot get the panoramic image to open as a url. The dermandar.com embed code
   basically adds the panoramic image with a play button in the centre that when
   pressed launches the full screen panoramic.
 * What I think I need is a Java function with the embed code then pass it a variable
   and run the script but with limited java knowledge I wouldn’t know how to do 
   this. For example:
 * JAVA Function:
    <div id=”dmd_pano_(_variable_)” style=”width: 960px; height: 
   150px;”></div> <script type=”text/javascript”> var dmdEmbeds = dmdEmbeds || [],
   _variable__w=’960′, _variable__h=’738′; (function(){ dmdEmbeds.push(‘_variable_‘);})();
   </script> <script type=”text/javascript” src=”[http://static.dermandar.com/js/embed.js?v=94.84.65″></script&gt](http://static.dermandar.com/js/embed.js?v=94.84.65″></script&gt);
 * Then the area map code:
    <area shape=”rect” coords=”130,35,1,53″ callFunction(
   variable)>
 * Like you said it is hard when you do not know what their code is doing. I have
   asked their support team for help with this. I’m guessing that I would not require
   their first <div> tag as this places an image on page which I would not require.
 *  Moderator [bcworkz](https://wordpress.org/support/users/bcworkz/)
 * (@bcworkz)
 * [13 years, 1 month ago](https://wordpress.org/support/topic/image-maps-use-java-script/#post-3656495)
 * The teaser image with play button seems to be a fundamental part of their scheme.
   Unless you can find what function call actually launches the full panorama, the
   location map hot spot approach seems doomed.
 * However, it appears you can control the teaser image embed size. Is there a lower
   limit? What if you embedded really small teaser images, and absolutely located
   them on top of your location map where the hot spots are? I hope this wacky idea
   bears some fruit for you, good luck!
 *  Thread Starter [asteadman](https://wordpress.org/support/users/asteadman/)
 * (@asteadman)
 * [13 years, 1 month ago](https://wordpress.org/support/topic/image-maps-use-java-script/#post-3656497)
 * The issue there is still how to get the click on the image map to call all of
   that code and how to use the div tags on the image map in the area tag.
 * I don’t usually but for now I will give up. In future I may write my own code
   to call my own panoramic images hosted on my own site.
 * thanks for the feedback 🙂

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Image maps – Use JAVA script?’ is closed to new replies.

 * In: [Hacks](https://wordpress.org/support/forum/plugins-and-hacks/hacks/)
 * 4 replies
 * 2 participants
 * Last reply from: [asteadman](https://wordpress.org/support/users/asteadman/)
 * Last activity: [13 years, 1 month ago](https://wordpress.org/support/topic/image-maps-use-java-script/#post-3656497)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics
