PDA

View Full Version : Ultimate Fade-in slideshow (v2.6.1) Responsive div



stman
12-10-2018, 03:28 AM
1) Script Title: Ultimate Fade-in slideshow (v2.6.1)

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex14/fadeinslideshow.htm

3) Describe problem: I have this working fairly well. Even got the images to re-size as the screen pixels change. However, when the screen gets smaller and the images do too, the gallery background only gets smaller horizontally. It stays the same vertically. The result is a black background above and below the image.
Is there a way to get the black area to resize and maintain its aspect ratio?
I have seen some attempts to answer this question on here but I can't seen to get any to work. If you have some code that will help me Please, Please, please be very clear as to where it goes (css, head, body, specific div, etc...) Please do not assume I know anything, I probably don't!!
Thank You for your help.

molendijk
12-10-2018, 09:38 PM
What you want can't be easily handled by a script that uses arrays of images (the script on DD). You're better off with a script that uses divs having backgrounds, like the one on this page (http://mesdomaines.nu/eendracht/slideshow_responsive11/slideshow.html). You can put the page in an iframe having certain dimensions and put it on another page, something like this:
<body>
<br>
<h2 style="text-align: center">THIS IS A SLIDESHOW</h2>
<iframe class="iframe_slideshow" src="http://mesdomaines.nu/eendracht/slideshow_responsive11/slideshow.html" style="position: relative; width: 500px; max-width: 100%; height: 350px; display: block; margin: auto; border: 1px solid silver">
</iframe>
</body>

stman
12-11-2018, 06:07 AM
stman says
I think I may have "fixed" this! I was able to get the black area to disappear (not re-size). I went into the script and searched for all instances of black. I found 3. I changed the color from 'black' to '#ffffff00'. As you know #ffffff is black but adding 00 makes it transparent.
This did it. It is still there but transparent which means for me, it is gone!!

stman
12-11-2018, 06:12 AM
Hope it is ok to make that small change.

molendijk
12-11-2018, 12:16 PM
But then there may be some unwanted horizontal space between the buttons beneath the container for the images (if there are any) and the images themselves when the screen gets very small. If that's no problem for you, it's okay to replace black with #ffffff00 in the script. It won't do any harm to it.