Reputation: 63
I have been struggling with this for 2 days now and have read (and tried) more 'hacks' than I can imagine and nothing I do seems to work.
I have an SVG map of the US, there are jQuery events for mouseenter and mouseleave that work fine in other browsers that IE 11 (and I assume 9 & 10) are ignoring.
When entering a state's border the fill should change (try it in FF) and a tool tip should show up (and follow the mouse). Again they work fine in other browsers but IE just ignores them. I tried a mouseover event just to see if it worked and it did. IE also correctly works on the click function but these other two just bomb.
You can see the page at http://amgoa.org/State-Gun-Laws the JS is at http://amgoa.org/scripts/reciprocity.js
Here's a snippet of the JS:
$('.state').mouseenter(function() {
if (!state_selected) {
$(this).css('fill', '#c8b33b');
}
if (strpos($(this).attr('id'), 'R_') === false) {
$('#state_label').text($(this).attr('alt')).show();
$(document).mousemove(function(e) {
$('#state_label').css({
left: e.pageX - 55,
top: e.pageY + 20
});
});
}
else if (state_selected) {
$('#state_label').text('').hide();
}
});
$('.state').mouseleave(function() {
if (!state_selected) {
$('#state_label').text('').css('display', 'none');
$(this).css('fill', '#001a8b');
}
});
Any help would be truly appreciated as this is holding up a bigger project on this site using a similar map, this failure on this page isn't the end of the world but on the other one it is mission critical that it works.
Upvotes: 2
Views: 1306
Reputation: 63
Found the problem, it was a bug in the jQuery version I was using. Updated the version and the problem is gone
Upvotes: 2