10 examples of 'javascript detect screen size responsive' in JavaScript

240
function detectMobile(){ //tries to detect if user is using a mobile device
241
		
242
	if(screen.width <= 900){
243
		console.log("mobile device detected...adjusting board size and layout");
244
		document.getElementById("chatleft").style.display = "none";
245
	}
246
}

756
function detectMobile(isHideNotation){ //tries to detect if user is using a mobile device
757
		
758
	if(screen.width <= 900){
759
		console.log("mobile device detected...adjusting board size and layout");
760
		document.getElementById("chatleft").style.display = "none";
761
		if(isHideNotation){
762
			document.getElementById("notation").style.display = "none";	
763
		}
764
	}
765
}

43
export function getScreenSize() {
44
  const width = window.innerWidth
45
  switch (true) {
46
  case (width < 760):
47
    return 'mobile'
48
  case (width < 1025):
49
    return 'laptop'
50
  case (width < 1200):
51
    return 'desktop'
52
  default:
53
    return 'wide-desktop'
54
  }
55
}

6
static detectTablet(ua) {
7
  Tablet.detectWebTab.call(this, ua);
8
}

3
export function getInitialWidthByUserAgent(userAgent) {
4
  if (['Android', 'iOS'].includes(userAgent.os.family)) {
5
    if (['iPad'].includes(userAgent.device.family)) {
6
      // For tablet
7
      return 'md';
8
    }
9
    // For mobile phone
10
    return 'sm';
11
  }
12
  // For desktop
13
  return 'lg';
14
}

109
isDesktopScreenSize(specs = null) {
110
    return !this.isMobileScreenSize(specs);
111
}

68
function isTablet (ua) {
69
    if (ua.match(/ipad/) || (ua.match(/android/) && !ua.match(/mobi|mini|fennec/))) {
70
        return true;
71
    }
72
    return false;
73
}

113
_responsiveWidth() {
114
    if (this.navbar.classList.contains('is-canvi-open') && window.matchMedia('(min-width: 0px)').matches) {
115
        this.navbar.style.width = this.options.width;
116
        this._responsiveWidthHelper(this.options.width);
117
    }
118
119
    if (this.navbar.classList.contains('is-canvi-open') && Array.isArray(this.options.responsiveWidths) && this.options.responsiveWidths.length > -1) {
120
        this.options.responsiveWidths.forEach(element => {
121
            if (window.matchMedia(`(min-width: ${element.breakpoint})`).matches) {
122
                this.navbar.style.width = element.width;
123
                this._responsiveWidthHelper(element.width);
124
            }
125
        });
126
    }
127
}

51
function isMobile() {
52
  //var size = window.getComputedStyle(document.body,':after').getPropertyValue('content');
53
  //return size.indexOf("mobile") !=-1;
54
  return $(window).width() < 767;
55
}

16
isLargeScreen() {
17
    if (
18
        $(this._window).width() >= this._config.largeScreenMinWidth &&
19
        $(this._window).height() >= this._config.largeScreenMinHeight
20
    ) {
21
        return true;
22
    }
23
24
    return false;
25
}