2014-03-30 2 views
-1

사용중인 브라우저 (Chrome, Firefox, IE, Safari, Opera)를 감지해야하는 페이지에서 작업하면서 변경하려는 플래그 값을 1에서 5로 설정하고 있습니다 내 이미지 태그의 소스 (기본적으로 현재 사용중인 브라우저에 따라 아이콘 이미지를 표시하고 싶습니다).jQuery를 사용하여 브라우저 검색

jQuery를 사용해야합니다. 내 초기 선택은 js 였지만 브라우저를 탐색하는 동안 일부 사용자가 스크립트를 끄고 설정에서 Opera와 같은 브라우저의 사용자 에이전트를 수정할 수 있으므로 매우 안정적인 옵션이 아닌 것 같습니다. 내가 틀렸다면 나를 바로 잡아라.

누군가 코드를 도와 주시겠습니까?

편집 :이 질문을 다시하는 이유는 모범 사례와 검색을위한 $ .support 대 $ .browser의 사용에 대해 다른 중복 질문이 있지만 이해하기 쉽기 때문에 $ .support는 불투명 지원 만 검사합니다 . 사용중인 브라우저를 정확히 나타낼 수 있습니까? 적절한 로고를 표시하는 필자의 작업은 브라우저 이름 (버전이 아님) 만 확인하면됩니다. 이것을 어떻게 할 수 있습니까?

+0

http://api.jquery.com/jquery.browser/ – David

+1

의견에 대해서는 " 내 jQuery를 사용 하여이 필요합니다. 내 초기 선택 js "jQuery 참고 ** 자바 스크립트, 그냥 자바 스크립트 라이브러리. – mralexlau

+1

또한 브라우저의 사용자 에이전트를 수정하는 것과 관련하여 네, 가능하지만 어쩌면 자신이 염려하고 싶은 것이 아닙니다. 사용자가 의도적으로 사용자 에이전트 문자열을 변경하는 경우 웹 사이트에서 다른 스타일 동작을보아야합니다. – mralexlau

답변

1

$.browser에는 브라우저가 무엇인지 알 다양한 옵션이 있습니다.

/chrome|chromium|firefox|msie|opera/.exec(navigator.userAgent.toLowerCase()).toString().replace(/chrome|chromium/g, "-webkit-").replace(/firefox/g, "-moz-").replace(/msie/g, "-ms-").replace(/opera/g, "-o-") 

js 검사 아래의 계좌로 사용자 에이전트 switching을하지 않습니다,

당신은 JQuery와 버전 1.9+

+0

'jQuery.browser'는 v1.3에서 비추천되었으며 v1.9에서 제거되었습니다. 문서 도구 : http://api.jquery.com/jQuery.browser/ – Mooseman

1

참고 this plugin을 사용할 수 있습니다 (1.3에 사용되지 않는) 경우 브라우저 style 재산 실제로 이미 존재하거나 나중에 동적으로 삽입되는 style 속성을 지원합니다. 주로 animations으로 구성되었지만 브라우저에서 css, style 속성을 테스트하도록 수정할 수는 있습니다. props이 이미 stylesheet에 있으면 에 vendor prefixes이 삽입됩니다. props 나중에 동적으로 삽입하는 경우, vendor prefixes도 기능을하는 props에 삽입하거나 부착

// prefix.1.1.min.js 2013, 2014 guest271314 
    // add css `prefixes` 
    // TODO: `opera` compatibility; utilizes `-o-`, `-webkit-`, w3c 
    (function prefix() { 
     /* var el = $(selector).get(0), i.e.g, $("body").get(0), $("#animated").get(0) */ 
     var prefixes = {"MozAnimation": "-moz-","webkitAnimation": "-webkit-" 
         ,"msAnimation": "-ms-","oAnimation": "-o-"}; 
     var props = ["animation", "backface-visibility", "border-radius" 
        , "box-shadow", "transform", "transform-style", "transition"]; 
     $.each(prefixes, function(key, val) { 
      $("style") 
      .attr({"data-prefix": val,"class": String(val).replace(/-/g, "")}); 
      return !(key in el.style); 
     }); 
     $.each(props, function(index, value) { 
      var cssPrefix = $("style").attr("data-prefix"); 
      if (value in el.style === false) { 
       $.fn.pfx = function(prop, pfxprop, q) { 
        return $("style").html($("style").text() 
          .replace(new RegExp(prop, "g"), q 
          + $("style").attr("data-prefix") + pfxprop)) 
       }; 
       $("style").pfx("@keyframes", "keyframes", "@") 
       .pfx(value, value, ""); 
      }; 
     }); 
    }()); 

GitHub의 https://github.com/guest271314/prefix/blob/master/prefix.1.1.min.js

관련 문제