C# jQuery ImageMapster:突出显示问题

C# jQuery ImageMapster:突出显示问题,c#,jquery,asp.net,imagemap,imagemapster,C#,Jquery,Asp.net,Imagemap,Imagemapster,让ImageMapster高亮显示地图区域时遇到问题。在阅读文档时,我的印象是,只要使用$'img'.mapster;我应该能够看到我的地图区域突出显示与鼠标 我不会看到这种情况发生。我可以选择区域,但它们不能用鼠标移动 但是,如果我在地图区域上放置onMouseOver和onMouseOut属性,那么我可以使highlight函数工作 这是我的问题的关键。当我试图将ImageMapster与一些动态C代码集成时,我无法在地图区域中放置onMouseOver和onMouseOut属性。C对象We

让ImageMapster高亮显示地图区域时遇到问题。在阅读文档时,我的印象是,只要使用$'img'.mapster;我应该能够看到我的地图区域突出显示与鼠标

我不会看到这种情况发生。我可以选择区域,但它们不能用鼠标移动

但是,如果我在地图区域上放置onMouseOver和onMouseOut属性,那么我可以使highlight函数工作

这是我的问题的关键。当我试图将ImageMapster与一些动态C代码集成时,我无法在地图区域中放置onMouseOver和onMouseOut属性。C对象WebControl.CircleHotSpot似乎不支持自定义属性

所以我的问题有两个:

如何使地图区域高亮显示仅用于ImageMapster代码? 有没有办法向C对象WebControl.CircleHotSpot添加属性? 下面是我目前使用的javascript和HTML标记

JavaScript:

$(document).ready(
    function()
    {
        $('#Image1').mapster({
            fillOpacity: 0.5,
            mapKey: 'alt',
            staticState:true,
            render_highlight: 
            {
                fillColor: '2aff00',
            },
            render_select: 
            {
                fillColor: 'ff000c',
            }
        });

        $('#Image2').mapster({
            mapKey: 'alt',

            stroke: true,
            strokeOpacity: 1.0,
            strokeColor: '000000',
            strokeWidth: 2,

            fill: true,
            fillColor: '0000ff',
            fillOpacity: 0.25,

            render_select: 
            {
                fillOpacity: 0.75,
                fillColor: 'ff0000'
            },
            render_highlight: 
            {
                fillOpacity: 0.5,
                fillColor: '00ff00'
            }
        })
    }
); 
标记:

<img id="Image1" src="bicycleparts.png" usemap="#ImageMap1" />

<map name="ImageMap1" id="ImageMap1">
    <area shape="circle" coords="100,50,50" href="" title="1" alt="1" onMouseOver="$('#Image1').mapster('highlight','1')" onMouseOut="$('#Image1').mapster('highlight',false)" />
    <area shape="circle" coords="200,100,50" href="" title="2" alt="2" onMouseOver="$('#Image1').mapster('highlight','2')" onMouseOut="$('#Image1').mapster('highlight',false)" />
    <area shape="circle" coords="300,150,50" href="" title="3" alt="3" onMouseOver="$('#Image1').mapster('highlight','3')" onMouseOut="$('#Image1').mapster('highlight',false)" />
    <area shape="circle" coords="400,200,50" href="" title="4" alt="4" onMouseOver="$('#Image1').mapster('highlight','4')" onMouseOut="$('#Image1').mapster('highlight',false)" />
    <area shape="circle" coords="500,250,50" href="" title="5" alt="5" onMouseOver="$('#Image1').mapster('highlight','5')" onMouseOut="$('#Image1').mapster('highlight',false)" />
</map>

<img id="Image2" src="bicycleparts.png" usemap="#ImageMap2" />

<map name="ImageMap2" id="ImageMap2">
    <area shape="circle" coords="100,50,50" href="" title="1" alt="1"/>
    <area shape="circle" coords="200,100,50" href="" title="2" alt="2"/>
    <area shape="circle" coords="300,150,50" href="" title="3" alt="3"/>
    <area shape="circle" coords="400,200,50" href="" title="4" alt="4"/>
    <area shape="circle" coords="500,250,50" href="" title="5" alt="5"/>
</map>

解决方法是确保href不为空。在我的例子中,如果我设置href=则ImageMapster工作正常-在标记上突出显示而不使用mouseover/mouseout函数

现在对于C,我可以设置CircleHotSpot.NavigateURL=以编程方式解决我的解决方案


感谢@joshingaround提供的解决方案。

此问题的解决方案是确保href不是空的。在我的例子中,如果我设置href=则ImageMapster工作正常-在标记上突出显示而不使用mouseover/mouseout函数

现在对于C,我可以设置CircleHotSpot.NavigateURL=以编程方式解决我的解决方案


感谢@joshingaround提供的解决方案。

一位朋友建议将$document.load替换为$window.load,因为可能图像尚未加载。这不起作用。一位朋友建议将$document.load替换为$window.load,因为可能图像尚未加载。这不起作用。谢谢你分享你的答案。谢谢,你为我节省了很多时间:谢谢你分享你的答案。谢谢,你为我节省了很多时间: