2016-10-09 4 views
0

이미지 맵 핫스팟 플러그인과 함께 사용되는 jQuery를 작성하여 사용 된 아이콘을 기반으로 팝업에 클래스를 추가했습니다.jQuery - 사파리에서 수업을 추가하지 않으셨습니까?

이 기능은 Chrome과 Firefox에서 작동하지만 Safari에서는 작동하지 않습니다. 이유를 파악할 수 있는지 궁금합니다.

$(window).load(function() { 
    $('.info-icon').each(function() { 
    var icon = $(this); 
    var bgImg = $(this).css('background-image'); 


    if (bgImg == 'url("http://www.domain.com/client1/wp-content/themes/BespokeTheme/images/purple-circle.svg")') { 
     $(this).prev().addClass('detected-pu purple-popup'); 
    } 
    if (bgImg == 'url("http://www.domain.com/client1/wp-content/themes/BespokeTheme/images/orange-circle.svg")') { 
     $(this).prev().addClass('detected-pu orange-popup'); 
    } 
    if (bgImg == 'url("http://www.domain.com/client1/wp-content/themes/BespokeTheme/images/green-circle.svg")') { 
     $(this).prev().addClass('detected-pu green-popup'); 
    } 
    if (bgImg == 'url("http://www.domain.com/client1/wp-content/themes/BespokeTheme/images/lblue-circle.svg")') { 
     $(this).prev().addClass('detected-pu lblue-popup'); 
    } 
    if (bgImg == 'url("http://www.domain.com/client1/wp-content/themes/BespokeTheme/images/dblue-circle.svg")') { 
     $(this).prev().addClass('detected-pu dblue-popup'); 
    } 
    })  
}); 

감사!

+1

사파리가 생각하는 바를 보려면 –

+0

이런 종류의 코딩은 실제로 잘 작동하지 않습니다. CSS의 URL이나 색상을 하드 코드 된 값과 일치시키려는 경우에는 너무 많은 것들이 있습니다. 그것을 뒤죽박죽으로 만들 수 있고, 다른 브라우저는 다른 것들을 반환 할 수 있습니다. – adeneo

답변

0

Thanks to Jaromanda X - 왜 사파리가 생각했는지 알아보기 위해 bgImg를 로깅하는 것에 대해 생각하지 못했습니다. (. http://..) 사파리가 URL의 결과로 큰 따옴표를 삭제 한 반면, 문자열, URL로 추적되는

모든 :

는 대부분의 브라우저가 URL ("// ... HTTP")을 반환되었다 밝혀 지금 해결, 포인터에 대한 Jaromanda 감사!

관련 문제