I have downloaded an Europe map and I need to add an OnClick function, that, instead of changing the color to yellow, should open a mini PopUp inside the same page, showing some info about that state.
In the custom events section, it says
Custom functions will not be added to the automatically generated source code.
Add them manually to the $.CSSMap(); function options object.
So I put it in the index.html, but it still doesn't work.
Can someone help?
Thanks.
Reading from the docs:
Custom events
onClick: function(listItem){} Function function called when region is clicked
to prevent default click actions add the rel="nofollow" attribute to the links
So you can use something like this if I'm not wrong:
$("#map-europe").CSSMap({
onClick: function(item){
//something like this...
popitup("http://example.com?state="+item);
}
});
//original code: http://stackoverflow.com/a/14351988/5032157
function popitup(url) {
newwindow = window.open(url,'name','height=300,width=250');
if (window.focus) {
newwindow.focus();
}
return false;
}
I was unable to test it, so answer if this doesn't works with the error so I can edit the answer.
First edit: If you want a lightbox and not a popup window (which I think is what you want), you can use: http://fancybox.net/
Hope it helps.
