Ultimate Fade In Slideshow responsiveness

**axiom28** · 10-15-2014, 11:44 AM

1) Script Title: Ultimate Fade In Slideshow v2.6

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...nslideshow.htm

3) Describe problem:

Well everything works as it should, however, when it comes to the mobile resposiveness the program doesn't operate
as I expected it to, reducing the size of the browser does certainly reduce the size of the image as well as maintaining
the height to width ration. The problem is in the black background that appears behind the top and bottom of the image
as the image shrinks. It shrinks in width to match the image width, but does not shrink in height, so at the minimum
size we have this huge black margin top and bottom of the image.
Another problem which might be related is that although it is stated that the width and height can be stated as a percentage
the width aspect of this does work, but when I try to set the height as a percentage nothing appears on the web page at all.

My image size is 830 x 360 pixels, I can set the width like this [ '85%', 360 ] everything works except I have the problem stated above,
if I set the size like this [ '85%', '43%' ] I get no slide show at all.

Please advise what am I doing wrong.

Sorry I just realised after reading the rules that I forgot to include a link to my page I am working on, here it is:

http://www.thetaware.co.za/Demo_two/

Ian

**axiom28** · 10-24-2014, 06:20 AM

http://www.dynamicdrive.com/dynamici...nslideshow.htm

I posting this again as after 10 days I received no replies even though other posts, posted afterwards on the same script were all replied to, I am not sure why that is. Anyway maybe my title wasn't clear. For the moment I cannot use the script because of this problem. Perhaps I didn't explain the problem clearly enough.

Well everything almost works as it should, however, when it comes to the mobile responsiveness the program doesn't operate
as I expected it to, reducing the size of the browser window does certainly reduce the size of the image as well as maintaining
the aspect ratio. The problem is there is a black background that appears behind the image at same height as the un-minimized image.
So we end up with a black margin at the top and bottom of the minimized image, so the elements above and below the image remain the same distance apart, instead of following the height of the image as it shrinks.

Another problem which might be related is that although it is stated that the width and height can be stated as a percentage
the width aspect of this does work, but when I try to set the height as a percentage nothing appears on the web page at all.

My image size is 830 x 360 pixels, I can set the width like this [ '85%', 360 ] everything works except I have the problem stated above,
if I set the size like this [ '85%', '43%' ] I get no slide show at all.

Please advise what am I doing wrong.

Ian

**Beverleyh** · 10-24-2014, 07:08 PM

I don't see the DD script in the page you linked to in your first post but have you seen the advice about media queries? http://www.dynamicdrive.com/dynamici...eshowguide.htm

If you need more help please post a web address with the script included.

**ddadmin** · 10-25-2014, 04:25 AM

As Beverleyh pointed out, please read the related guide on responsiveness. See the section "Dynamic image dimensions" to help with the first part of your question. For the 2nd on setting the slidesshow height to be fluid, it's more tricky, though the section on CSS media queries at the bottom should provide a stop gap solution.