How to detect a browser using jQuery?

Question

I have an issue with a css which is implement by the jQuery, css is work fine in mozilla but not in chrome so need to make a changes in css according to the browser BUT in JQUERY

Anyone help me to get the browser whether it is firefox,chrome or any other.

 if ($browserFirefox) {
    ....code 
    $('#test').css("margin-top","10%");
 }
 if ($browserChorme) {
   code goes here
 }
 if ($browserXYZ) {
   code goes here
 }

Ask instead question regarding css is work fine in mozilla but not in chrome?! What is the issue with margin-top: 10%;? — A. Wolff
– A. Wolff, Commented Jun 6, 2015 at 11:28
Possible duplication of stackoverflow.com/questions/9847580/… — Thomas Weglinski
– Thomas Weglinski, Commented Jun 6, 2015 at 11:31
Possible duplication stackoverflow.com/questions/9847580/… — Samir Das
– Samir Das, Commented Jun 6, 2015 at 11:32
if none of the answers worked or you are facing problems, let me know so I can help — AmmarCSE
– AmmarCSE, Commented Jun 6, 2015 at 20:32

NiiL · Accepted Answer · 2015-06-06 11:33:23Z

10

Use navigator.userAgent for browser information, like:

if (navigator.userAgent.search("MSIE") >= 0) {
    //code goes here
}
else if (navigator.userAgent.search("Chrome") >= 0) {
    //code goes here
}
else if (navigator.userAgent.search("Firefox") >= 0) {
    //code goes here
}
else if (navigator.userAgent.search("Safari") >= 0 && navigator.userAgent.search("Chrome") < 0) {
    //code goes here
}
else if (navigator.userAgent.search("Opera") >= 0) {
    //code goes here
}

answered Jun 6, 2015 at 11:33

NiiL

2,8371 gold badge28 silver badges37 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Ashouri · Accepted Answer · 2015-06-06 11:31:53Z

1

If you need to do changes in css with differente browsers ,you can follow blow codes easily

if Webkit (Safari/Chrome) {

 #myDIV {margin-top:-3px}

 } else if (Firefox) {

 #myDIV {margin-top:0px}

 } else { // IE and other browsers

  #myDIV {margin-top:1px}
 }

Although in level of Jquery you can use jquery.browser.Take a look at this http://api.jquery.com/jquery.browser/

answered Jun 6, 2015 at 11:31

Ashouri

8944 silver badges19 bronze badges

Comments

gennaro esposito · Accepted Answer · 2018-03-29 08:31:17Z

1

For a better use of the answer of @Nikhil Butani. Happy coding ;)

if (navigator.userAgent.search("MSIE") >= 0) {
    //code goes here
}
else if (navigator.userAgent.search("Chrome") >= 0) {
    //code goes here
}
else if (navigator.userAgent.search("Firefox") >= 0) {
    //code goes here
}
else if (navigator.userAgent.search("Safari") >= 0 && navigator.userAgent.search("Chrome") < 0) {
    //code goes here
}
else if (navigator.userAgent.search("Opera") >= 0) {
    //code goes here
}
else if (navigator.userAgent.search("NET") >= 0) {
    //code goes here
}
else if (navigator.userAgent.search("Edge") >= 0) {
    //code goes here
}

answered Mar 29, 2018 at 8:31

gennaro esposito

111 bronze badge

Comments

leapin_leprechaun · Accepted Answer · 2015-06-06 11:29:32Z

0

You might be as well fixing the issue in your css rather than with scripting. Check out http://browserhacks.com/ for browser specific targeting information. You can still use jquery to put a particular class on it, but then declare things differently in your css

answered Jun 6, 2015 at 11:29

leapin_leprechaun

6051 gold badge4 silver badges15 bronze badges

Comments

daniel451 · Accepted Answer · 2015-06-06 11:30:47Z

0

This can be achieved with the jQuery.browser property

if ($.browser.msie) {
    ....code 
    $('#test').css("margin-top","10%");
 }
 if ($.browser.webkit) {
   code goes here
 }
 if ($.browser.mozilla) {
   code goes here
 }

Should do the work.

answered Jun 6, 2015 at 11:30

daniel451

11.1k22 gold badges76 silver badges131 bronze badges

Comments

Community · Accepted Answer · 2017-05-23 10:31:17Z

0

You can use $.browser.

if($.browser.mozzila){
}

However, I strongly recommended you try to come up with a cross-browser solution. User-agent sniffing is not a recommended approach as it can break easily(think multiple versions of same browser).

See Downsides of using the navigator object / user-agent sniffing for detecting IE versions and Browser Detection (and What to Do Instead)

Update For jQuery > 1.9

This property was removed in jQuery 1.9 and is available only through the jQuery.migrate plugin. Please try to use feature detection instead.

edited May 23, 2017 at 10:31

CommunityBot

11 silver badge

answered Jun 6, 2015 at 11:29

AmmarCSE

30.7k6 gold badges48 silver badges53 bronze badges

1 Comment

A. Wolff Over a year ago

No, this has been removed from jq 1.9

Collectives™ on Stack Overflow

How to detect a browser using jQuery?

6 Answers 6

Comments

Comments

Comments

Comments

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

Comments

Comments

Comments

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related