Topic: How to eliminate of top and bottom margins in Tiltviewer

It appears that tiltviewer always leaves a space on the top and bottom, even though the #flashcontent div definition has specified height (and width) parameters. I may be wrong, but the aspect ratio of the #flashcontent div appears to be always square.

How do I get rid of the top and bottom space/margins, so that my gallery/thumbnail images are always top justified ?

See http://www.klix4u.com/gallery.shtml for sample.

Thanks in advance.

Re: How to eliminate of top and bottom margins in Tiltviewer

It appears that tiltviewer always leaves a space on the top and bottom

This is likely to be caused by the CSS on your web page rather than by TiltViewer itself.

I may be wrong, but the aspect ratio of the #flashcontent div appears to be always square.

TiltViewer can be embedded into a #flashcontent <div> of any aspect ratio you like.
Try the following. Take the sample gallery from the TiltViewer download package as a starting point. Open the 'index.html' page in a plain text editor.
Change:

    #flashcontent {
        height: 100%;
    }

.. to:

    #flashcontent {
        height: 400px;
        width: 800px;
    }

... and change the body's background's color from black (#000000) to white (#ffffff) so that you can see the edges of the gallery.
Open 'index.html' in a browser to view the gallery and you will see that the gallery's aspect ratio is rectangular (rather than square) and that the gallery itself goes all the way to the edges of the Flash stage (as can be seen when clicking on an image to enlarge it).

Try setting your #flashcontent <div>'s dimensions in absolute pixel values (rather than as percentages) and temporarily change the color of each <div> in your own page to see where the extra space is coming from.

Steven Speirs
SimpleViewer Support Team.

Re: How to eliminate of top and bottom margins in Tiltviewer

Hi Steven,

I made the modifications as you recommended. While you are right that the #flashcontent aspect ratio is dependent on the dimensions of the DIV, it still appears that there is space above and below the images. See this at http://www.klix4u.com/gallery/index.htm and also at http://www.simpleviewer.net/tiltviewer/app/.

One of the issues of decreasing the height parameter of the #flashcontent div, is that the image size of the thumbnail also decreases, thus the reason for finding how to reduce/eliminate the top and bottom space.

Re: How to eliminate of top and bottom margins in Tiltviewer

If you wish the images to appear larger in the gallery when zoomed out, then you would need to purchase TiltViewer-Pro and decrease the zoomedOutDistance Pro Option: http://www.simpleviewer.net/tiltviewer/ … s.html#pro
The default value is 7500. For example, you could try:

fo.addVariable("zoomedOutDistance", "5000"); 
Steven Speirs
SimpleViewer Support Team.

Re: How to eliminate of top and bottom margins in Tiltviewer

My issue is not about the Zoomed out size. The zoomed out size uses the entire space of the DIV, which is absolutely fine. My original issue still remains how to get rid of the top and bottom space as provided in the earlier examples.

Re: How to eliminate of top and bottom margins in Tiltviewer

I'm still unsure what space you are referring to.

The zoomed out size uses the entire space of the DIV, which is absolutely fine.

Do you mean the zoomed-in size (where a large zoomed-in image can be seen at the very edges of the Flash stage)?
Are you referring to the space between the top of the uppermost row of images (when zoomed-out) and the top edge of the Flash stage (and similarly at the bottom of the gallery)? If so, then changing the zoomedOutDistance is the solution. If not, then perhaps you could upload a screenshot somewhere showing the space to which you refer. Thank you.

Steven Speirs
SimpleViewer Support Team.

Re: How to eliminate of top and bottom margins in Tiltviewer

Here is the URL for the image - http://devcncx.concentric.com/TiltViewer-Space.gif

I am referring to the space above and below the thumbnails as indicated by the blue arrows.

Re: How to eliminate of top and bottom margins in Tiltviewer

Thank you for uploading the screenshot.
This space can, indeed, be reduced by decreasing the value of the Pro Option zoomedOutDistance.

Steven Speirs
SimpleViewer Support Team.