【问题标题】:Prettyphoto changing lightbox height and widthPrettyphoto 改变灯箱高度和宽度
【发布时间】:2012-02-22 12:43:24
【问题描述】:

我正在尝试修改单击缩略图时打开的图像框的高度和宽度,但没有成功。

这是我目前的代码

@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>

任何帮助将不胜感激。

【问题讨论】:

    标签: jquery asp.net-mvc-3 prettyphoto


    【解决方案1】:

    我也试过了,但同样没有运气。

    也有一些作弊:)

    检查PrettyPhoto.css 文件/css/prettyPhoto.css 搜索div.pp_pic_holder 并使用!important 应用所需的宽度

    Ex.width: 825px !important;
    

    干杯!!!

    【讨论】:

      【解决方案2】:

      jquery.prettyPhoto.js中,你应该修改以下变量:

      imageWidth = v-200;  // change to -30
      imageHeight = d-200; // change to -90
      

      【讨论】:

        【解决方案3】:

        使用css轻松控制的简单方法

        div.pp_pic_holder { width: 300px!important; }
        .pp_content { width: 275px!important; }
        a.pp_close { right: 60%; }
        div.pp_pic_holder { left: 40%!important; }
        

        【讨论】:

          【解决方案4】:

          你可以使用allow_resize: false,点击后会显示你原来的图片大小。对于缩略图图像,您需要使用 CSS 类

          allow_resize: false, /* 调整大于视口的照片大小。真/假 */

          试试这个。这就是我让它为我工作的方式=)

          【讨论】:

            猜你喜欢
            • 2012-07-23
            • 1970-01-01
            • 2010-11-02
            • 1970-01-01
            • 1970-01-01
            • 2018-07-10
            • 1970-01-01
            • 2017-05-26
            • 2014-12-21
            相关资源
            最近更新 更多