View Full Version : Hotspots

26 Jul 2010, 6:24 AM
Hi everyone,

I would just like to quickly return to a problem I was having with hotspots on images. Evant posted some superb code for setup, which was then modified for a panel (below). My image doesn't display as long as I keep ".show();" but it works well with the original setup code. Is this because "demos.BottomTabs" is no longer declared specifically as a variable?

var regions = [{
overlayText: 'Text 1',
region: new Ext.util.Region(330, 200, 350, 180)

demos.BottomTabs = new Ext.Panel({
html: '<img src="overlay-1.png" alt="Photo" />'

demos.BottomTabs.body.on('click', function(e, t){
var xy = e.xy, active = {
top: xy[1],
right: xy[0],
bottom: xy[1],
left: xy[0]
Ext.each(regions, function(r){
if (r.region.contains(active)) {
var overlay = new Ext.Panel({
floating: true,
modal: true,
centered: true,
width: 400,
height: 400,
scroll: 'vertical',
html: r.overlayText
return false;
}, null, {
delegate: 'img'