SharePoint 2010 - 图片库幻灯片 Web 部件答案

【问题标题】：SharePoint 2010 - Picture Library SlideShow Web PartSharePoint 2010 - 图片库幻灯片 Web 部件
【发布时间】：2014-08-18 00:28:40
【问题描述】：

我正在使用图片库幻灯片 Web 部件，我想显示实际图像而不是预览图像。

我找到了一个解决方案，使用 JQUERY 将预览图像的宽度扩大到页面上我想要的宽度，但这当然会破坏图像的质量。

上传的实际图片将位于以下路径：/Home%20Page%20Banners/Banner2.jpg

SharePoint 创建预览图像并放置在另一个路径中并重命名文件，例如：/Home%20Page%20Banners/_w/Banner2_jpg.jpg

我的问题是如何让预览图像显示上传的实际完整图像而不是按比例缩小的图像？

【问题讨论】：

标签： sharepoint

【解决方案1】：

Picture Library SlideShow Web 部件类被标记为sealed，因此无法扩展它。

但它可以在客户端进行自定义，更准确地说，幻灯片库 (imglib.js) 中的函数可以被覆盖。

如何在图片库幻灯片 web 部件中显示全尺寸（原始）图像

下面描述的解决方案允许在幻灯片 Web 部件中显示原始图像。为了完成它，在幻灯片中初始化图片的功能应该被覆盖（见下面的代码）。

步骤 1. 将以下 JavaScript 代码保存到文件中，例如在 SlideshowObjectInitializer.txt 中并将其上传到 SiteAssets 库

<script type="text/javascript">


function SlideshowObjectInitializer() {

  ShowPic = (function(ShowPicOrig) {
      return function() {

           var ssObj = arguments[0];  //SlideShow object
           var curPicIdx=ssObj.index; //current picture index

           ShowPicOrig.apply(this, arguments); //call original ShowPic

           //apply some changes to display original picture in SlideShow control
           ssObj.image.src = ssObj.linkArray[curPicIdx]; //display original image instead of web image
           //change picture & container size to auto instead of fixed (by default web image size is used)
             ssObj.image.setAttribute('height','100%'); 
             ssObj.image.setAttribute('width','100%'); 
             var cell = ssObj.cell; 
             cell.style.width = 'auto';
             cell.style.height = 'auto';
             cell.style.display = '';
             var pcell = ssObj.cell.parentNode; 
           pcell.style.width = 'auto';
             pcell.style.height = 'auto';
      };
  })(ShowPic);

}  


ExecuteOrDelayUntilScriptLoaded(SlideshowObjectInitializer, 'imglib.js');
</script>

步骤 2。在幻灯片 Web 部件所在的页面上添加 Content Editor Web 部件 (CEWP)，并在内容编辑器工具窗格中的内容链接下，键入 /SiteAssets/SlideshowObjectInitializer.txt。

有关自定义幻灯片 web 部件的更多详细信息，请关注this blogpost

【讨论】：