我一整天都用头撞在墙上。我试图运行imagemapster和bootstrap。好像我只能跑一个或另一个。我一直试图像这样使用noConflict:
< script src = "http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" > < /script>
<!-- Load any Bootsrap JS files before calling jQuery.noConflict() -->
<script src="bootstrap.js"></script >
< script >
// Put jQuery 1.10.2 into noConflict mode.
var $jq1 = jQuery.noConflict(true); < /script>
<!-- Trying to use this for my imagemapster code -->
<script type="text/javascript
" src="
http: //ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js"></script>
&#13;
<!--this is the imagemapster code I'm trying use jquery/1.7.1 with-->
< script type = "text/javascript" >
$(document).ready(function() {
function state_change(data) {
//alert(data.state+":"+data.selected);
}
$('b').bind('mouseover', function() {
$('img').mapster('tooltip', this, "The text is: " + $(this).text());
});
$('img').mapster({
staticState: true,
showToolTip: true,
noHrefIsMask: false,
onStateChange: state_change,
fill: true,
fillColor: 'ffffff',
fillOpacity: 0,
mapKey: "group",
strokeWidth: 2,
stroke: true,
strokeColor: 'f27821',
render_select: {
fillColor: '000000',
fillOpacity: 0.2
},
areas: [{
key: 'top',
stroke: false,
fillOpacity: 0,
toolTip: '<div class="blkBG pg6ToolTip1"><ul><li>Almost all triploid pregnancies result in miscarriage in the first or second trimester</li><li>The chance of triploidy does NOT increase with maternal age</li><li>At 10 weeks gestation, 1 in 1,000 pregnancies is affected by triploidy</li></ul></div>'
}, {
key: 'left',
stroke: false,
fillOpacity: 0,
toolTip: '<div class="blkBG pg6ToolTip2"><div class="pg6Border"><h3>Paternal in origin:</h3></div><div class="pg6Border"><div class="half">Placenta:</div><div class="half">Large, abnormal (cystic)</div></div><div class="pg6Border"><div class="half">Fetus:</div><div class="half">Abnormal</div></div><div class="pg6Border"><div class="half">Associated with partial molar pregnancy?</div><div class="half">Yes, maternal risk for gestational trophoblastic disease (GTD)</div></div></div>'
}, {
key: 'right',
stroke: false,
fillOpacity: 0,
toolTip: '<div class="blkBG pg6ToolTip3"><div class="pg6Border"><h3>Maternal in origin:</h3></div><div class="pg6Border"><div class="half">Placenta:</div><div class="half">Small, normal (non-cystic)</div></div><div class="pg6Border"><div class="half">Fetus:</div><div class="half">Abnormal, growth-restricted</div></div><div class="pg6Border"><div class="half">Associated with partial molar pregnancy?</div><div class="half">No, no known association</div></div></div>'
}]
});
}); < /script>
<!-- begin snippet: js hide: false console: true babel: false -->
&#13;
这是我正在处理的页面的链接。注意imagemapster正在工作,而bootstrap则没有。我的目标是使大图像响应。 http://cjehost.com/qt/nipt/stacktest.php
答案 0 :(得分:0)
这不是查询问题。它与imagemapster和bootstrap之间的脚本冲突有关。换句话说,两个脚本都使用jquery的一个实例工作,但带有usemap的图像没有响应。