Solved

Using ClientSide ImageMaps in HTML.

Posted on 1998-06-26
8
147 Views
Last Modified: 2010-04-09

I have a map which is clickable and their co-ordinates are defined in the same HTML file i.e.
<HTML>
<HEAD>
</HEAD>

<BODY>
<IMG src="sonic.gif" width=500 height=600 usemap="#map1" border="0">

<MAP NAME="map1">
<area shape="rect" alt="Access Guide" coords="0,0,10,20" href="guide.html">
<area shape="rect" alt="Search" coords="2,4,15,30" href="search.html">
<area shape="rect" alt="Four" coords="10,50,1000,1000" href="four.html">
<area shape="rect" alt="Icim Company" coords="23,11,188,87" href="http://www.icil.com">
<area shape="rect" alt="Deccan Paper" coords="66,36,159,68" href="http://www.deccan.com/">
</MAP>
</BODY>
</HTML>

My question is can I seperate the map file and keep it in a different HTML file and call from the
main HTML file i.e

1.html will look like this

<HTML>
<HEAD>
</HEAD>
<BODY>
<IMG src="sonic.gif" width=500 height=600 usemap="2.html#map1" border="0">
</BODY>
</HTML>
my 2.html will look like this
<HTML>
<HEAD>
</HEAD>
<BODY>
<MAP NAME="map1">
<area shape="rect" alt="Access Guide" coords="0,0,10,20" href="guide.html">
<area shape="rect" alt="Search" coords="2,4,15,30" href="search.html">
<area shape="rect" alt="Four" coords="10,50,1000,1000" href="four.html">
<area shape="rect" alt="Icim Company" coords="23,11,188,87" href="http://www.icil.com">
<area shape="rect" alt="Deccan Paper" coords="66,36,159,68" href="http://www.deccan.com/">
</MAP>
</BODY>
</HTML>

I am trying out this and I could not get it working. So, first of all I would really like to know that,
whether we can separate map definition file from main HTML file.

Really would appreciate UR help as we are need this info. very urgently.
Thanks.
0
Comment
Question by:voletisri
  • 3
  • 3
  • 2
8 Comments
 
LVL 2

Expert Comment

by:johnny99
ID: 1844408
That should work -- try putting the full URL, like this:

http://www.yourcompany.com/2.html#map1

That might do it. Good luck. I'll come back and post again after I've checked something.
0
 

Author Comment

by:voletisri
ID: 1844409

I have tried giving the complete URL.But it still doesnot work.The browser versions I am using are Internet Explorer 4.0 and Netscape 4.0.Do the above browsers support my problem or not,I am not able to understand.Please if somebody could help me out in solving this problem,I would appreciate.

Thanks
0
 
LVL 28

Expert Comment

by:sybe
ID: 1844410
I suppose you want this because you want to use the same map in several html-files. The you can use SSI to include seperate textfiles into a html:

<!--#INCLUDE FILE="map1.txt"-->

You can just use plain text for the map-code, so no <HTML> and <BODY> tags.

But if you want to do this because you want to code to be invisible to the browser, then there is no way to do it, because it is CLIENT side, so it has to be read by the browser.


0
 

Author Comment

by:voletisri
ID: 1844411

I donot want to use any server side includes.The project which I am doing has such requirement.Different HtmlS WILL BE using the same map file.That is why I want to seperate it.
Is there any way out? Please help.

Thanks
0
Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

 
LVL 28

Accepted Solution

by:
sybe earned 100 total points
ID: 1844412
The imagemap has to be in the same document in the browser. There is no way to use another html document for the imagemap code.
You can seperate the files on the server, but they must be in the same document for the client. If you want to seperate the files on the server then there are a limited number of possibilities:

1. SSI, is according to me the best option, because it is not depending on the browser. But you do not want to use this. I do not know you do not want to use it, but it is a pity, because it is a very elegant solution to your problem.

2. external javascript (works only in browser with javascript turned on)

call it with:

<script language="JavaScript" src="external_js_file.js">
</script>

the code for external_js_file.js would be:

<script>
document.write('<MAP NAME="map1"> ');
document.write('<area shape="rect" alt="Access Guide" coords="0,0,10,20" href="guide.html">')

etc etc
</script>

You have to make an extra MIME-type on the server

3. Use Frontpage and make a frontpage include. When published, Frontpage will merge the document and the include into one file on the server.

4. Use a serverside imagemap, you have to write it only once and can call it from any html page.





0
 
LVL 2

Expert Comment

by:johnny99
ID: 1844413
Hi, Violetisri

I have tried it, and it doesn't work on my server either: you were quite right to reject my answer.

To all the people telling you to use SSI etc, answer me this -- why do several sources of documentation tell me this /does/ work?

I'm completely bemused and I'm going to ask in a newsgroup...

Hope you're holding the fort!

If you're depearate for a solution to a large site which has a number of imagemaps, can't you use a fully-featured text editor to do a big Search and Replace on all your documents to put the imagemap <MAP> stuff in? That's my workaround anyway.
0
 
LVL 2

Expert Comment

by:johnny99
ID: 1844414
OK here's what I've learned having a look around in newsgroups: external client-side image maps *are* in the HTML 3 spec, but are not implemented in either browser.

It can't be done.

Tell us your situation, and we'll have to come up with another answer.
0
 

Author Comment

by:voletisri
ID: 1844415
Hai Johnny,sybe

Thank you very much for your help.After going thru' some documents I too found out that external client side imagemap files are not supported by either IE or Netscape.I got another solution for this.Actually my project uses NetDynamics tool to build the application.What I could do is before loading the page I read the file into Java String and add it to the HTML on the fly.This solves my problem.
        I was under the opinion that if external Client side Image map files could be implemented as given in the HTML Tutorials,it would be more efficient.That's why I was trying for it.

Finally,Thank you very much again.

Regards,
Srinivas
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Foreword (July, 2015) Since I first wrote this article, years ago, a great many more people have begun using the internet.  They are coming online from every part of the globe, learning, reading, shopping and spending money at an ever-increasing ra…
Things That Drive Us Nuts Have you noticed the use of the reCaptcha feature at EE and other web sites?  It wants you to read and retype something that looks like this.Insanity!  It's not EE's fault - that's just the way reCaptcha works.  But it is …
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

867 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

23 Experts available now in Live!

Get 1:1 Help Now