Isn't there a bit of JavaScript missing in this question ?

Anyway, if I've got your problem right and if I were you at this point, I'd
rather use the position <http://docs.jquery.com/CSS/position> method of the
element you want to scroll down to instead of adding heights which might be
a lot trickier (you'd have to take margins, paddings and such into account).

Michel Belleville


2009/11/9 Dylan <dylan.h...@gmail.com>

> I have the structure shown at the bottom of this post.
>
> The scenario is that relative to an event on the page the scrollTo is
> used to set the #top to the necessary cc_ DIV. The problem is that the
> container in which all cc_'s are placed is 202px in height (can
> change). When the scrollTo is instructed and the height of the
> remaining cc_ DIVs left is less than this it corrupts and future
> scrollTo's do not function correctly (the #cc_n doesn't scrollTo the
> top of the DIV but further down!)
>
> I suspect the solution will be somewhere in the region of
>
> rather than just issuing the scrollTo...
>
> - get the total height of all the divs starting with "cc_" after me
> (being the current cc_ DIV)
> - if the value above is higher than my parent DIV height then issue
> the scrollTo
>
> Sounds easy but any help with the syntax (or indeed a pointer if I'm
> on the wrong track) would be splendid!
>
> Cheers
> Dylan
>
> <div id="poiScrollPaneHolder">
>        <div class="jScrollPaneContainer" style="width: 235px; height:
> 202px;">
>                <div id="poiScrollPane" style="overflow: visible; height:
> auto;
> width: 218px; padding-right: 5px; position: absolute; top: 0px;">
>                        <div class="item" id="cc_0">
>                                <div class="poi-title test">POI ONE</div>
>                                <div class="text">POI Title Text here.</div>
>                        </div>
>
>                        <div class="item" id="cc_1">
>                                <div class="poi-title test">POI TWO</div>
>                                <div class="text">POI Title Text here.</div>
>                        </div>
>
>                        .
>                        .
>                        .
>
>                        <div class="item" id="cc_15">
>                                <div class="poi-title test">POI
> FIFTEEN</div>
>                                <div class="text">POI Title Text here.</div>
>                        </div>
>
>
>                </div>
>        </div>
>
>
>        <div class="jScrollPaneTrack" style="width: 12px; height: 178px;
> top:
> 12px;">
>        <div class="jScrollPaneDrag" style="width: 12px; height: 16px; top:
> 162px;">
>        <div class="jScrollPaneDragTop" style="width: 12px;"/>
>        <div class="jScrollPaneDragBottom" style="width: 12px;"/>
>        </div>
>        </div>
>        <a href="javascript:;" class="jScrollArrowUp" style="width:
> 12px;">Scroll up</a>
>        <a href="javascript:;" class="jScrollArrowDown disabled"
> style="width: 12px;">Scroll down</a>
>        </div> <!-- see default.js/createPOI/poiMarkup -->
> </div>
>
>

Reply via email to