Hi,
I added a slideshow webpart but wanted it to be full-size, as the normal specifications make it smaller than anticipated. I found a code that works perfectly, but after one or two slide transitions the slideshow starts jumping causing the whole page to move momentarily. I added a Script Editor below the slideshow, and have tried placing it before the slideshow also but it doesn’t work. If anyone knows an adjustment to the code to make this stop or something I need to remove to make it stop, it would be greatly appreciated!!
<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>
You generally do not modify the OOTB CSS file. You can add your own to the master page or use the Alternate CSS property for the site to point to your custom file. I suggested the Script Editor web part because this appears to be something that you only need on this particular page (master page change would add the CSS to every page.)
