“Always on ” jquery command

Question

recently i\'m working on a project to make an interactive directory map for a mall without using flash, because they need to access from mobile devices.

but i have issu

Answer 1

The problem is you don't turn off the highlight for currently selected area when clicking on another.

Place this:

$('.selected').data('maphilight', {alwaysOn: false}).trigger('alwaysOn.maphilight');

in your salhia.js, in the .mapclick click handler:

$('.mapclick').click(function(){
    $('.selected').data('maphilight', {alwaysOn: false}).trigger('alwaysOn.maphilight');

    $('.mapclick').removeClass('selected');
    $(this).addClass('selected');

    var shop = '.shopdetails#' + $(this).attr('shop');
    var htmlCode = $(shop).html();

    $('.shopinfo').fadeOut(500, function(){
        $('.shopinfo .shopdetails').html(htmlCode);
        $('.shopinfo').fadeIn(500);
    });
});

Answer 2

Changed a bit the code shown on previous answer so it is more generic:

// Init
$('.map').maphilight({
       stroke: false,               
}); 

// Reset all map

$('.selected').data('maphilight', {alwaysOn:false}).trigger('alwaysOn.maphilight'); 

$('area').click(function(){    
    // Reset all areas with class 'selected'
    $('.selected').data('maphilight', {alwaysOn: false}).trigger('alwaysOn.maphilight');
    // Remove class selected
    $('area').removeClass('selected');
    // select and highlight this area
    $(this).addClass('selected');
    $(this).data('maphilight', {alwaysOn: true}).trigger('alwaysOn.maphilight');
});