Jquery Screen Width and Jquery on Window Resize
Jquery screen width condition will be executed while loading the document. Jquery on window resize play a nice role for developers to help with jquery media queries.
Solution to Jquery Screen Width
|
1 2 3 4 5 6 |
if ($(window).width() < 960) { alert('Less than 960'); } else { alert('More than 960'); } |
The above code will help you to allocate the width of the screen as the page start loading.
The first line is the condition to check whether the window’s width is smaller than 960, if that is true it will alert the “less than 960” text.
You May Want Jquery on window resize to play around
Here is another solution to jquery screen width but this time screen width resize.
|
1 2 3 4 5 6 7 8 |
$(window).resize(function() { if ($(window).width() < 960) { alert('Less than 960'); } else { alert('More than 960'); } }); |
$(window).resize() function is playing role here and it will watch for the resizing of windows and will act according.
[[ Also check How to Change Image Source Jquery ]]
Do you still need something very simple?
|
1 |
$(window).width() |
Also, give try to this one as well
|
1 |
$(document).width() |
You can also target a specific Id, Class or Div to put condition on your query. replace the ‘body’ with your tag or attribute
|
1 |
$('body').width() |
If Window Width Jquery – Last Example
|
1 2 3 |
if ($(window).width() < 960) { alert('Less than 960'); } |
You can play with If and else as you want but you can use if window width jquery to help you out in this case.
Wrapping Up the Jquery on Window Resize
Jquery basically help you in doing more with writing less code. The above functions will help you to get the value of screen width. If there is still something confusing please put your query in the comment section.