Friday, August 14, 2015

Remove dashed line that appears around elements of an HTML image map

If you discover that you're being plagued by a dashed line that appears around the <area>  elements of your HTML image map whenever a user clicks on a given element of the image map, here is some jQuery code that you can use to remove those dashed lines...

$(document).ready(function() {

     $("area").focus(function() { $(this).blur(); });

}

To help explain matters, the dashed line is simply an indicator that the user placed the focus on the given element when he/she clicked on it.  The above code works by using the blur method to remove the focus from the selected item after it's been has been clicked.