Win a copy of Mesos in Action this week in the Cloud/Virtualizaton forum!
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic

How to display text over an image in IE

 
Norm Radder
Ranch Hand
Posts: 886
6
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Hi,
I'm trying to create an HTML page that displays an image and will display a small text at the location the mouse is clicked. I've gotten it to work with Firefox but am unable to get it to work with IE.

After I determine the text I want to display (its in NamesList[]) at the clicked location I use the following Javascript code:

Definitions from other parts of code:


Works in Firefox, but not in IE.
Is there code that will work in both browsers?
Is there code that will work in IE that I can chose if in IE?

Thanks,
Norm
 
Ankit Garg
Sheriff
Posts: 9521
22
Android Google Web Toolkit Hibernate IntelliJ IDE Java Spring
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Works in Firefox, but not in IE

What actually happens in IE (and in which version of IE)?? Do you get an error or the div is placed at the wrong place??
 
Eric Pascarello
author
Rancher
Posts: 15385
6
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
You are not showing how in the world you are getting the mouse position which seems to be the part that has the error.

Eric
 
Norm Radder
Ranch Hand
Posts: 886
6
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Thanks for the replys. IE puts the text in a new area above the image and the text is black vs cyan.

Here is the full code. The NamesList array contains: x, y, Name


The site editor removes: SRC="1990_Reunion-300_ED1.jpg" HEIGHT="96%" ALT="1990 Reunion" from the IMG tag
 
Eric Pascarello
author
Rancher
Posts: 15385
6
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
In the future click the "Disable HTML in this message" checkbox when it screws up your html

Eric
 
Eric Pascarello
author
Rancher
Posts: 15385
6
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Looking at your code I noticed TRUE andFALSE being declared.

Do you know JavaScript by default has true and false? All you are doing is reinventing the wheel there.

Looking at your code, it shows why using a library such as jQuery would help. There is no real need for browser sniffing.

Have you thought about using a classic image map? What does NamesList look like?

Eric


 
Norm Radder
Ranch Hand
Posts: 886
6
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Thanks for the reply.
Appreciate all comments, however the main problem is not solved yet: Why does code work in FF and not in IE?
What needs to be changed to make it work?

My experience with IMAGEMAP was that they were hard to set up. Do they give the same effect as my code working in FF?

Here is layout of NamesList.js:


Thanks,

 
Norm Radder
Ranch Hand
Posts: 886
6
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I downloaded the jQuery-ui-1.7.2 and tried the index.html file that was in the .zip file and see that the developers of that package also have trouble with IE. The text in the box in the "Overlay and Shadow Classes (not currently used in UI widgets)" section extends past the end of the background colored area when viewed in IE at certain window sizes. A little sloppy looking. I'm using IE7


When will there be ONE standard for Javascript?
 
Norm Radder
Ranch Hand
Posts: 886
6
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I found a way to let my code work in IE. Define the <DIVs to be moved before the page finishes loading. Then I can move them over an image in IE and FF. If I define them after the page has loaded, IE doesn't move them over the image.>
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 64838
86
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Norm Radder wrote:When will there be ONE standard for Javascript?

It doesn't really have much to do with JavaScript, but with the DOM provided by the browsers.

You can write to Steve Ballmer, but I don't think it would do much good.
 
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic