Проблемы, связанные с реализацией jquery.maphilight.min.js

Question

Мне нужна помощь или совет по реализации сценария maphilight.min.js на моем веб-приложении asp.net C#.

Вот проблема, без скрипта, прикрепленного к элементу управления ImapMap, изображение соответствует правильному размеру, который статичен при 800x600.

После внедрения maphilight.min.js изображение изменяет размеры и клипы из-за размера окна управления, тем самым отсекая большую часть изображения.

<script>$(function() { $('.map').maphilight({ fillOpacity: '0.2', strokecolor: 'cccccc' }); });</script> 
<asp:ImageMap ID="map" runat="server" CssClass="map" ImageUrl="" width="800" height="600" ></asp:ImageMap> 

Без кода maphilight это выглядит следующим образом:

Когда код реализован он выглядит следующим образом:

Но горячие точки по всей видимости, правильно соответствуют изображению, если оно было изменено так, как должно быть.

До сих пор я пробовал последнюю версию maphilight и до сих пор не удалось. Я также попытался вручную изменить параметры высоты и ширины в maphilight до 800x600, если я не пропустил что-то.

Answer 1

После просмотра файла maphilight.min.js эта функция была изменена, чтобы исправить проблемы, которые я описывал выше, я установил для свойства backgroundSize статический размер «800px 600px», который дал мне правильные результаты. Он был изменен со значения «содержать»

k = a("<div></div>").css(
        { 
         display: "block", backgroundImage: 'url("' + this.src + '")', backgroundSize: "800px 600px", position: "relative", padding: 0, width: 800, height: 600 
        } 
       ),