I seem to be stuck on an issue to make an image map using javascript Objects. The goal is to get this code to return a color. I'm working on my own text editor plugin using js objects and I got the bold, underline, font size to work, but I can't seem to get around the ForeColor option. This is the code for the forecolor selector I have so far. If you have a better solution, pls suggested. thanks.
$.fn.JStextEditor = function(options){
// extend the option with the default ones
var settings = $.extend({
coords : ["7,36,21,51","29,36,43,50","51,36,65,51"]
//with some other options..
},options);
//Font Selector
var ForeColorPick = $("<img/>",{
id : "forecolorPicker",
src : "images/colorPallette.png",
usemap : "#colorPicker",
css : {
display : "none",
"float" : "left",
width : "185px",
height : "214px",
border : "none"
},
data : {
commandName : "foreColor"
},
click : execCommand
}).appendTo(SomeDiv );
var colorMap = $("<map/>",{
"name" : "colorPicker"
}).appendTo(buttonPane );
$.each(settings.coords,function(i,v){
$("<area/>",{
value : v,
shape : "rect",
css : {
cursor : "pointer"
},
"coords" : v
}).appendTo(colorMap );
});
};
Have you considered using a plugin like this?
http://www.outsharked.com/imagemapster/default.aspx?what.html
This helped me immensely on a previous project.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.