This is a known fact that out-of-the-box Picture Library SlideShow Web Part does not display the images in its original size. Further more, unfortunately it is not supported to configure in web part what image type (original, web or thumbnail) should be displayed in Slideshow.
The JavaScript code described below allows to display original images (without re-sizing) in Slideshow Web Part. In order to display original image the technique is to override the ShowPic function. For embedding JavaScript on page, use Content Editor web part (CEWP) on the same page where you have also inserted your SlideShow web part.
<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>
In the above given code you can adjust the size by modifying these lines/values:ssObj.image.setAttribute('height','100%');
ssObj.image.setAttribute('width','100%');
The value '100%' can be changed to '90%' or '80%' and even in pixels you can mention the size, example:ssObj.image.setAttribute('height','400');
ssObj.image.setAttribute('width','700');
10 comments:
whoah this weblog is excellent i like studying your articles.
Stay up the good work!You already know, lots of individuals are searching around for this info, you could help themm greatly.
My weblog - dungeon rampage cheat
Hello, I can add this to my slideshow so it shows pictures as their original size but it adds me a link to a blank page when I click the slideshow's images. How can I delete this link? Thanks!
Hi, this is little strange... where exactly the link is added, could you elaborate? My implementation of above code worked perfectly fine without any link.
Hi Zakir, this sounds great, but I need some more help... :-)
I am using Sharepoint 2007, Picture Gallery, where I can trigger Slide Show Viewer through the menu setting Actions/View Slide Show. Can I somehow use this script (or something similar) in my situation as well? I tried adding it to the Picture Gallery within CEWP, but it doesn't work. I also nned to mention that there are quite a lot of subfolders in the gallery so that I can triger the Slide Show Viewer not in root of the gallery but a few folders below. Any suggestions? Thanks!!!
Are you inserting the above code within the CEWP on that same page where you have also inserted your Picture Library Web Part? Please make a note this code works with only Picture Library Web Part with CEWP on the same page.
awesome!! works like a charm!! thanks a lot to the developer!!
Is it possible to center the slideshow? It always sticks to left side. I want to put it in center so I will not end up with lots of white space on right side.
Nice Article
Thanks so much! Just what I was searching for. I am book marking your site. :)
Thanks for the script, but it works only in IE. How can I get full size images in chrome and mozilla as well?
Thanks in advance.
Post a Comment