任何人?任何线索?Maphilight与IE9中的jquery选项卡发生冲突
我正试图在同一页上创建两个具有相同功能的地图。这适用于所有现代浏览器(IE11,Chrome等),但不适用于IE9。您可以通过以下小提琴来证明这一点:http://jsfiddle.net/Guill84/Sws2T/13/
启动插件的脚本我粘贴在下面以便于参考。是否有理由在所有浏览器中正确加载,但不在IE9中?或者我的代码有问题吗?所使用的插件是“Maphilight”提前(https://github.com/kemayo/maphilight)
谢谢, ģ
$(function() {
$('.map').maphilight({
stroke: false,
fillColor: 'D2D2D2',
fillOpacity: 1
});
$('.map2').maphilight({
stroke: false,
fillColor: 'D2D2D2',
fillOpacity: 1
});
//light up first element
//this code is repeating below but not sure how to make more condensed
var data = $(this).data('maphilight') || {};
data.alwaysOn = true;
$('.map, .map2').data('maphilight', data).trigger('alwaysOn.maphilight');
// initialize tabbing
$(".tabs area:eq(0)").each(function() {
$(this).addClass("current");
});
$(".tab-content").each(function() {
$(this).children(":not(:first)").hide();
});
$(".tabs area").each(function (o, i) {
var d = $(this).data('maphilight') || {};
d.fillOpacity = 1;
d.alwaysOn = true;
$(this).attr("rel", d.fillColor);
$(this).data('maphilight', d).trigger('alwaysOn.maphilight');
});
$(".tabs area").hover(function() {
var d = $(this).data('maphilight') || {};
//d.fillOpacity=0.6;
d.fillColor = "A0A0A0";
$(this).data('maphilight', d).trigger('alwaysOn.maphilight');
}, function() {
var d = $(this).data('maphilight') || {};
//d.fillOpacity=0.6;
if (typeof d.clicked === "undefined" || d.clicked == false) {
d.fillColor = $(this).attr("rel");
} else {
d.fillColor = "379ee0";
}
$(this).data('maphilight', d).trigger('alwaysOn.maphilight');
});
//map clicks
$(".tabs area").click(function() {
//areas loop:
$(".tabs area").not(this).each(function (o, i) {
var d = $(this).data('maphilight') || {};
d.clicked = false;
d.fillColor = $(this).attr("rel");
if (d.alwaysOn === false) {
//d.alwaysOn = false;
$(this).data('maphilight', data).trigger('alwaysOn.maphilight');
}
});
var data = $(this).data('maphilight') || {};
data.alwaysOn = true;
data.fillColor = "379ee0";
data.clicked = true;
$(this).data('maphilight', data).trigger('alwaysOn.maphilight');
if ($(this).hasClass("current") === false) {
var thisTarget = $(this).attr("href");
$(this).parents(".tabs").find('area.current').removeClass('current');
$(this).addClass('current');
$(this).parents(".tabs").nextAll(".tab-content").children(":visible").fadeOut(1, function() {
$(thisTarget).fadeIn("normal");
});
}
return false;
});
});
您好bodi0,非常感谢您对此进行调查。 panzoom功能似乎工作正常 - 当我彻底删除它时,我仍然遇到了maphilight不能加载两次的问题。事实上,如果有冲突,我认为它是与Jquery选项卡。如果你在代码'$(“#tabs”)。tabs({})中删除了这一行,'你会注意到插件正确加载......?我使用真正的IE9(我的客户...)。 – Noobster 2014-11-25 13:28:56
我的建议然后是试验旧版本/较新版本的jQuery UI,例如旧版本1.8.x或2.x – bodi0 2014-11-25 13:31:32
你好bodi0,我试过了,没有成功。我不明白发生了什么事。你有任何其他的提示或建议吗? – Noobster 2014-11-25 13:36:59