How To Use Media Query Using Jquery
if (window.matchMedia('(max-width: 768px)').matches)
{
// do functionality on screens smaller than 768px
}How To Use Media Query Using Jquery
if (window.matchMedia('(max-width: 768px)').matches)
{
// do functionality on screens smaller than 768px
}if media query jquery
$(window).resize(function() {
if ($(this).width() < 1024) {
// your code
} else {
// your code
}
});js media query
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<p>If the viewport is less than, or equal to, 700 pixels wide, the background color will be yellow. If it is greater than 700, it will change to pink.</p>
<p><strong>Resize the browser window to see the effect.</strong></p>
<script>
function myFunction(x) {
if (x.matches) { // If media query matches
document.body.style.backgroundColor = "yellow";
} else {
document.body.style.backgroundColor = "pink";
}
}
var x = window.matchMedia("(max-width: 700px)")
myFunction(x) // Call listener function at run time
x.addListener(myFunction) // Attach listener function on state changes
</script>
</body>
</html>Copyright © 2021 Codeinu
Forgot your account's password or having trouble logging into your Account? Don't worry, we'll help you to get back your account. Enter your email address and we'll send you a recovery link to reset your password. If you are experiencing problems resetting your password contact us
