jqueryasp.net-mvc-3prettyphoto

Prettyphoto changing lightbox height and width


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.


Solution

  • 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!!!