How can i run some JQ code, only when the user screen resolution is higher/lower than X?
Asked
Active
Viewed 564 times
4 Answers
2
Well i'd advise against using screen resolution because not everyone maximizes their window (let alone full-screens it). Check the window width/height, and do whatever accordingly:
var winW = $(window).width(),
winH = $(window).height();
if ( winW > X && winH > Y) {
waWaWeeWah(); // do stuff
}
Mark Pieszak - Trilon.io
- 61,391
- 14
- 82
- 96
-
Newer browsers allow you to detect the user's screen resolution using the screen.width and screen.height properties, like I show in my answer – Igor Konopko Aug 29 '12 at 14:17
-
Yeah I see that, completely forgot! +1 – Mark Pieszak - Trilon.io Aug 29 '12 at 14:19
1
Use window event listener, e.g.:
$(window).resize(function() {
if( $(window).width() < yourThreshold ){
// do your business
}
});
moonwave99
- 21,957
- 3
- 43
- 64
-
can i use css selectors with JQ to acomplish this? because when i use `$(window).width()` it dosent count the scroll bar, and its not dynamic – Samuel E. Aug 29 '12 at 15:10
-
Have a look around, e.g. http://stackoverflow.com/questions/596072/detect-window-width-and-compensate-for-scrollbars-javascript – moonwave99 Aug 29 '12 at 15:15
0
What about this suggestion I was trying to get some feedback on, it ties js to media queries: https://stackoverflow.com/questions/12203220/suggestion-for-responsive-design-jquery-and-mobile-sites
