I am trying to modify the height and width of the image box that opens when I click on a thumbnail but have not had any success.
This is my code so far
@for (int i = 0; i < Model.count; i++)
{
<a href= "@Url.Action("GetImage", "Image", new { id = i })" rel="prettyPhoto[pp_gal]">
<img src= "@Url.Action("GetImage", "Image", new { id = i })" alt="Image @(i+1)" width="240" height="240" /></a>
}
<script type="text/javascript">
$(document).ready(function () {
$("a[rel^='prettyPhoto']").prettyPhoto({
autoplay_slideshow: false,
show_title: true,
default_width: 300, //I have tried playing with these values
default_height: 200, //I have tried playing with these values
theme: 'pp_default',
overlay_gallery: false,
social_tools: false
});
});
</script>
Any help would be appreciated.
I tried too, but same no luck.
So did some cheating :)
Check PrettyPhoto.css
file /css/prettyPhoto.css
Search for div.pp_pic_holder
and apply required width with !important
Ex.width: 825px !important;
Cheers!!!