CODEWITHSUNDEEP
javascripthtmlcss
vjayap
vjayap

Reputation: 21

Stop window resizing below 768px

I want the entire page(window) to stop resizing below 768px and there should not be any horizontal scroll below 768px. Is there any way to do that?

Upvotes: 2

Views: 8127

Answers (4)

Ayatullah Rahmani
Ayatullah Rahmani

Reputation: 932

Using Jquery

$(document).ready(function(){
    if($(window).width() < 768){
    //do something 
    }
});

Using CSS

@media only screen and (max-width:768px)
   {
   /*do something*/ 
   }

Upvotes: 0

Dave L
Dave L

Reputation: 411

The browser / window is in the user's control and is dependent on the device also.

Using CSS you can set a minimum width of your page using:

min-width:768px;

However when the user resizes the browser to below this stage, you will see scrollbars appear. You site will no longer resize and get smaller, but the user will need to scroll left and right to see the full content of your page.

As mentioned below, you can hide the scrollbars with

overflow:hidden;

Or to target a specific scrollbar:

overflow-x:hidden;
overflow-y:hidden;

However, the user will still need to scroll sideways to see your full content...

Upvotes: 4

Brane
Brane

Reputation: 3339

If you want to get the size of the window you can do it like this:

var wid = $(window).width();
if(wid> 768){
    // something
}

Bind window resize events using resize event

$(window).on('resize', function(event){
    //here goes the magic
});

Upvotes: 0

user3187960
user3187960

Reputation: 337

You can't control the size of the window. You can use CSS to set min-width and min-height properties to ensure your page layout stays sane.

Upvotes: 0

Related Questions