{"id":1390,"date":"2022-08-30T15:16:08","date_gmt":"2022-08-30T15:16:08","guid":{"rendered":"https:\/\/unknownerror.org\/index.php\/2013\/11\/15\/imagemapster-jquery-plugin-in-joomla-collection-of-common-programming-errors\/"},"modified":"2022-08-30T15:16:08","modified_gmt":"2022-08-30T15:16:08","slug":"imagemapster-jquery-plugin-in-joomla-collection-of-common-programming-errors","status":"publish","type":"post","link":"https:\/\/unknownerror.org\/index.php\/2022\/08\/30\/imagemapster-jquery-plugin-in-joomla-collection-of-common-programming-errors\/","title":{"rendered":"Imagemapster jQuery Plugin in Joomla-Collection of common programming errors"},"content":{"rendered":"<p>I&#8217;ve been trying to use the Imagemapster jQuery plugin into my Joomla page but is not possible.<\/p>\n<p>Into the head of the index.php of the template I&#8217;ve put<\/p>\n<pre><code>\n<\/code><\/pre>\n<p>This code works without problem.<\/p>\n<p>Into an article I&#8217;ve put<\/p>\n<pre><code>\n\n$(document).ready(function () {\n       var image = $('img');\n       var xref = {\n            carrots: \"<b>Carrots<\/b> are delicious and may turn your skin orange!\",\n            asparagus: \"<b>Asparagus<\/b> is one of the first vegetables of the spring. Being a dark green, it's great for you, and has interesting side effects.\",\n            squash: \"<b>Squash<\/b> is a winter vegetable, and not eaten raw too much. Is that really squash?\",\n            redpepper: \"<b>Red peppers<\/b> are actually the same as green peppers, they've just been left on the vine longer. Delicious when fire-roasted.\",\n            yellowpepper: \"Similar to red peppers, <b>yellow peppers<\/b> are sometimes sweeter.\",\n            celery: \"<b>Celery<\/b> is a fascinating vegetable. Being mostly water, it actually takes your body more calories to process it than it provides.\",\n            cucumbers: \"<b>Cucumbers<\/b> are cool.\",\n            broccoli: \"<b>Broccoli<\/b> is like a forest of goodness in your mouth. And very good for you. Eat lots of broccoli!\",\n            dip: \"Everything here is good for you but this one. <b>Don't be a dip!<\/b>\"\n       };\n       var defaultDipTooltip = 'I know you want the dip. But it\\'s loaded with saturated fat, just skip it and enjoy as many delicious, crisp vegetables as you can eat.';\n\n       image.mapster(\n       {\n            fillOpacity: 0.4,\n            fillColor: \"d42e16\",\n            strokeColor: \"3320FF\",\n            strokeOpacity: 0.8,\n            strokeWidth: 4,\n            stroke: true,\n            isSelectable: true,\n            singleSelect: true,\n            mapKey: 'name',\n            listKey: 'name',\n            onClick: function (e) {\n                var newToolTip = defaultDipTooltip;\n                $('#selections').html(xref[e.key]);\n                if (e.key==='asparagus') {\n                    newToolTip = \"OK. I know I have come down on the dip before, but let's be real. Raw asparagus without any of that \" +\n                            \"delicious ranch and onion dressing slathered all over it is not so good.\";\n                }\n                image.mapster('set_options',{areas: [{\n                    key: \"dip\",\n                    toolTip: newToolTip\n                    }]\n                });\n            },\n            showToolTip: true,\n            toolTipClose: [\"tooltip-click\", \"area-click\"],\n            areas: [\n                {\n                    key: \"redpepper\",\n                    fillColor: \"ffffff\"\n                },\n                {\n                    key: \"yellowpepper\",\n                    fillColor: \"000000\"\n                },\n                {\n                    key: \"carrots\",\n                    fillColor: \"000000\"\n                },\n                {\n                   key: \"dip\",\n                  toolTip: defaultDipTooltip\n                },\n                {\n                   key: \"asparagus\",\n                   strokeColor: \"FFFFFF\"\n                }\n                ]\n        });\n      });\n      \n\n<br \/><img loading=\"lazy\" decoding=\"async\" id=\"puzzle\" src=\"images\/primaria\/puzzle_primaria_01.png\" alt=\"\" width=\"500\" height=\"500\" usemap=\"#puzzle\" \/>\n<br \/><br \/>\n<br \/>\n     \n<br \/><br \/>\n<\/code><\/pre>\n<p>As it shows on the demos page of the imagemapster plugin.<\/p>\n<p>I&#8217;ve obtained the error: Uncaught TypeError: Object # has no method &#8216;ready&#8217; ; and then I&#8217;ve solved changing $ by jQuery into the code.<\/p>\n<p>However, the image doesn&#8217;t show changes and in the javascript console there is not errors.<\/p>\n<p>What can I do? Where is the error?<\/p>\n<p>Thanks in advance.<\/p>\n<p>Fran<\/p>\n<p id=\"rop\"><small>Originally posted 2013-11-15 09:08:22. <\/small><\/p>","protected":false},"excerpt":{"rendered":"<p>I&#8217;ve been trying to use the Imagemapster jQuery plugin into my Joomla page but is not possible. Into the head of the index.php of the template I&#8217;ve put This code works without problem. Into an article I&#8217;ve put $(document).ready(function () { var image = $(&#8216;img&#8217;); var xref = { carrots: &#8220;Carrots are delicious and may [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-1390","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/1390","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/comments?post=1390"}],"version-history":[{"count":0,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/1390\/revisions"}],"wp:attachment":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/media?parent=1390"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/categories?post=1390"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/tags?post=1390"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}