CODEWITHSUNDEEP
javascriptbrowserwidth
rabbitt
rabbitt

Reputation: 2598

If browser width is greater that 1000px, show images

Is it possible to get the width of the browser web view and act on it if it is greater than 1000px?

Example (in pseudocode): If browser width is greater that 1000px;

<div style="position:fixed; top:0; left:0; z-index:1; visibility:visible;">
<img src="images/borderleft.png">
</div>

Upvotes: 4

Views: 16617

Answers (1)

Alan
Alan

Reputation: 46873

Modern Way: Media Queries

<div class="showWide">
<img src="images/borderleft.png">
</div>

// in your css file
.showWide {
   position:fixed; 
   top:0; 
   left:0; 
   z-index:1;
   visibility: hidden;
}

@media only screen and (min-width: 1000px) {
    .showWide {
        visibility: visible;
     }
}

2011 Way: JQuery

// returns width of browser viewport
if( $(window).width() > 1000)
{
  //add or unhide image.
}

And for more information...jquery width() documentation.

Upvotes: 13

Related Questions