Geek asks and answers

Use the MapHilight jQuery plugin to highlight in different colors

I am trying to figure out how to use MapHilight, but not very lucky. The only "documentation" on it seems to be just some working examples. Perhaps this is due to the fact that the site hosting the plugin does not seem to be working. I also recently learned jQuery, so I don’t know if I impede my progress. What I would like to do is to determine the appearance of my image map at a distance from the area by area. David Lynch A simple demo shows this, but I'm not sure how it works. I don’t understand why it uses the image, has a background for the containing div and for what purpose the videos work. Here is what I still have:

...
    <script type="text/javascript">
        $(function () {
            $('#ImageMap1').maphilight();
        });
    </script>
</head>
...

<div style="float: left">
    <img id="ImageMap1" src="solar_system.jpg" usemap="#ImageMapmapAreas" />
    <map id="ImageMapmapAreas" name="ImageMapmapAreas">
        <area alt="" title="" href="#Jupiter" coords="222,186,28" shape="circle"/>
        <area alt="" title="" href="#Earth" coords="135,194,13" shape="circle"
            data-maphilight="{'strokeColor':'0000ff','strokeWidth':5,'fillColor':'ff0000','fillOpacity':0.6}"/>
    </map>
</div>

, , . data-maphilight . , , , , , maphilight, , .

+3
3

, Silverlight, maphighlight, . , , , "" .

<div style="float: left">
    <img id="ImageMap1" src="http://geographyandhistory.wikispaces.com/file/view/solar_system.jpg/43347125/283x202/solar_system.jpg" usemap="#ImageMapmapAreas" />
    <map id="ImageMapmapAreas" name="ImageMapmapAreas">
        <area alt="" title="" href="#Earth" coords="228,151,53" shape="circle" data-maphilight='{"strokeColor":"0000ff","strokeWidth":5,"fillColor":"00ff00","fillOpacity":0.6}'/>
        <area alt="" title="" href="#Sun" coords="68,54,44" shape="circle" data-maphilight="{'strokeColor':'0000ff','strokeWidth':5,'fillColor':'00ff00','fillOpacity':0.6}"/>
    </map>
</div>​

- http://jsfiddle.net/k67gq/6/ , "" "" "-", .

+6

, . , , hilighting. Silverlight.

0

Instead of "or" using "am" in data-maphilight worked for me. Example: data-maphilight = "{" strokeColor "" 0000ff ", ...

0
source

More articles:


All Articles