If browser width is greater that 1000px, show images

Question

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>

Answer 1

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.