PDA

View Full Version : Ultimate Fade-in slideshow (v2.4) precise pixel alignment within a <td>



razman
03-09-2012, 12:21 AM
1) Script Title: :: Ultimate Fade-in slideshow (v2.4)

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

3) Describe problem: alignment within a specific height/width <td>

I need exact pixel alignment. I did a search of the forum, but I don't see that the question has been asked. I have an 800 x 444 pixel <td> cell. The images used in the slideshow are 800 x 444 pixels, is it not possible for the slideshow to fit the <td> perfectly?

I typically use SwishMax to develop a flash, fade-type, linkable slideshow. The flash has perfect pixel alignment within a table. I'm investigating the "Ultimate" script due to Apple's iPad not being able to display Adobe Flash. A fade-type, linkable slideshow in DHTML would be the perfect solution, but it appears that precise, exact, perfect pixel alignment is not a feature of the "Ultimate" script. That said, I'm not a DHTML guy, so I don't know what the hell I am talking about, but I am hoping you do.

jscheuer1
03-09-2012, 01:53 AM
As long as your markup, attributes and css for the show's wrapperid div and the td and the table it's in are clean (don't introduce any margin, border, padding, cellspacing, or cellpadding, there are no other elements in the td, not even an extra line break in the code for the markup, and the slideshow call on the page is set to those dimensions, it should be good. Even if you think you have all that covered, I or you may have missed something.

If you want more help, please include a link to the page on your site that contains the problematic code so we can check it out.

razman
03-09-2012, 05:18 PM
John, thanks for the offer of assistance.

Here's the functioning flash version:
http://webzar.com/bridge_street/
The table structure is not broken.

Here's the functioning flash version with the "Ultimate" head coding in place and the body flash coding removed:
http://webzar.com/bridge_street2/
The table structure is not broken.

Here's the above coding with the <div> added:
http://webzar.com/bridge_street3/
The table structure is broken.

Here's the above coding with the html simplified to its essence:
http://webzar.com/bridge_street3/index2.htm
The table structure is broken.

Rich

jscheuer1
03-09-2012, 06:36 PM
It's like I said. In this case it's css style creating margins. In bso.css line 26:


div {margin-left:10px; margin-top:20px; margin-right:0px;}

This adds 20px on the left and 40px on the top as the script generates nested div elements.

The fix is easy. Add this at the end of bso.css:


#fadeshow1, #fadeshow1 .gallerylayer {margin: 0;}

razman
03-09-2012, 07:11 PM
John, thank you. It took me longer to document the issue than it did for you to fix it.

I took your fix and implemented it and all was well. I then back stepped and removed your fix AND removed the offending div statement from the css file. As you already know, that worked, too.

I can see how I got turned around on this. You provided the answer in your previous post, but I was just not bright enough to investigate the css file. I had tunnel vision on the page coding and on dhtml in general.

Anyway, thank you for your help. I got the problem corrected, and I learned something, too. That's not a bad tally on the day.

Regards, Rich