How to detect a mobile device using jQuery (or JavaScript)?

Hi everyone! I'm a beginner frontend developer and I've encountered a task: the site needs to show different content for mobile and desktop users. For example, on phones I want to remove heavy animations and replace the desktop menu with a "hamburger" menu.\n\nThe problem is that I don't know how to properly detect if a user is visiting from a phone or tablet. I tried checking the window width using `$(window).width()`, but this is unreliable — a user could open the site on a desktop in a narrow browser window, and then the mobile version would activate where it's not needed. Or conversely, on a new iPhone with a large screen, the width could be greater than 1024px, and the site would display as desktop.\n\nHere's an example of my code that currently doesn't work as expected:\n\n```javascript\n$(document).ready(function() {\n if (