There is also alternative using css image width.
1. add to Page.ss the mobile css line
<link rel="stylesheet" media="only screen and (max-width: 400px)" href="mobile.css" />
2. add css to mobile.css file something like this:
@media screen and (max-device-width: 480px){
.crop {
width: 200px;
height: 150px;
overflow: hidden;
}
.crop img {
width: 400px;
height: 300px;
margin: -75px 0 0 -100px;
}
}
html of that css looks like this:
<div class="crop">
<img src="imagefilename.jpg" />
</div>
or
<p class="crop">
<img src="imagefilename.jpg" />
</p>
-------------------------------------------------------------------------------------------------------
Arvixe Web Hosting / SilverStripe Community Liaison | Looking for quality
SilverStripe Web Hosting? Look no further than
Arvixe Web Hosting!