Skip to content Skip to sidebar Skip to footer

Show Image If Screen Resolution Is Over?

I am looking for a way to show an image ONLY if screen resolution is higher than x,x for a webpage. The website it currently using only HTML/CSS, although I am open to ideas. If th

Solution 1:

For that, we usually use media queries

// Set Defaults for Small displays like Mobile.img { 
    display:none; // your image class or can be img tag
} 

// Desktop and landscape tablets more than 960 px@media (min-width: 960px){
   .img { display: block; margin: 0 auto;} // your image class or can be img tag
}

if you're interested just have a look at this tutorial

Solution 2:

.img
{
   display:none;
}
@media (min-width:800px) and (max-width:1200px)
{ 

 .img{display:block;}

}

you can visit this site for more information http://www.ibm.com/developerworks/library/wa-cssqueries/

Post a Comment for "Show Image If Screen Resolution Is Over?"