Created
August 8, 2013 21:12
-
-
Save albertpak/6188793 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| jQuery(window).ready(slideshowResize); | |
| jQuery(window).resize(slideshowResize); | |
| //function to resize and center images and slideshow | |
| function slideshowResize() { | |
| //SET CUSTOM VARIABLES | |
| //set ratio value by dividing the images width by it height | |
| //* I usually round this to 2 decmials | |
| var imageRatio = "1.75"; | |
| //set containerName equal to the div containing the image or slideshow function will use this div to set height and width so use 100% width or height for responsive demensions | |
| var containerName = ".slideshow"; | |
| //imageClass needs to specifcally target the actual image to center it properly in the container | |
| var imageClass = "li.slides img"; | |
| //create variables equal to containers heigh and width | |
| var ssWidth = jQuery(containerName).width(); | |
| var ssHeight = jQuery(containerName).height(); | |
| // creates width and height based on ratio and round off decimals | |
| var nWidth = (ssHeight * imageRatio).toFixed(0); | |
| var nHeight = (ssWidth / imageRatio).toFixed(0); | |
| //set img height and width based on screen size and ratio | |
| if (nWidth < ssWidth) { | |
| var fnWidth = ssWidth; | |
| var fnHeight = nHeight; | |
| } else { | |
| var fnWidth = nWidth; | |
| var fnHeight = ssHeight; | |
| } | |
| //set images width and height | |
| jQuery(".jw-slideshow img.slideImage").width(fnWidth).height(fnHeight); | |
| // centers images horizontally and vertically | |
| jQuery(imageClass).css("left", -((fnWidth - ssWidth) / 2)).css("top", -((fnHeight - ssHeight) / 2)); | |
| //MINIFIED FUNCTION | |
| //var imageRatio="1.75",containerName=".slideshow",imageClass="li.slides img",ssWidth=jQuery(containerName).width(),ssHeight=jQuery(containerName).height(),nWidth=(ssHeight*imageRatio).toFixed(0),nHeight=(ssWidth/imageRatio).toFixed(0);if(ssWidth>nWidth)var fnWidth=ssWidth,fnHeight=nHeight;else var fnWidth=nWidth,fnHeight=ssHeight;jQuery(".jw-slideshow img.slideImage").width(fnWidth).height(fnHeight),jQuery(imageClass).css("left",-((fnWidth-ssWidth)/2)).css("top",-((fnHeight-ssHeight)/2)); | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment