Question

The issue appears in every browser differently, in Firefox e.g. a whitespace appr. with the same height of the scrolling box appears if you scrollt to top again. In chrome the boxes get cramped up while scrolling an so on…

The used call is:

    for (i = 1; i < $('.picbox').length; i++) {
    $('#picbox' + i).scrollToFixed({
            marginTop: 50,
            limit: $('#pic' + (i + 1)).offset().top - $('#picbox' + i).height() - 30
    });
    }

What I’ve tried:

• Internet…
• Changing the margins, heights and so on
• giving the images fixed heights

Well… To check the behaviour:
http://www.animize.de/users/galerie/showall

And this is what it should behave like:
http://jsfiddle.net/y3qV5/760/

Gladly would appreciate any answer… I guess it is related to the css but not sure about that…

Answer 1

Well it was quite some research work – first you have to unset the scrolltofixed functions…

                           for (i = 1; i < $('.picfeeditem').length; i++) {
                            if ($.isScrollToFixed($('#picbox' + i))) 
                                { 
                                    $('#picbox' + i).trigger('remove.ScrollToFixed'); 
                                }
                                $('#picbox' + i).scrollToFixed({
                                        marginTop: 50,
                                        limit: $('#pic' + (i + 1)).offset().top - $('#picbox' + i).height() - 40
                                });
                        }

Also it was some css work as well, it’s important to have the attribute overflow:hidden on the container element, as scrolltofixed adds some weired container which leaves some whitespace… But well it’s working and up now.