How to track native browser scroll up-down movement

66 views
Skip to first unread message

Deepak Singh

unread,
Apr 16, 2012, 4:45:01 PM4/16/12
to google-we...@googlegroups.com
Hi,

I have the following scenario,

Html:
<div>
<div style="width:100%" ui:field="topDiv"></div>
<div style="width:40%" ui:field="leftDiv"></div>
<div style="width:60%" ui:field="rightDiv"></div>
</div>

Now, this uibinder is rendered at a particular position in html. Browser scrolls up and down and this uibinder scrolls up and down as usual.

Now, I need to achieve two things,

As the scrollbar moves,

when the 'topDiv' reaches the top postion of browser, it should not scroll any more and make its position fixed. When scrollbar scrolls up, 'topDiv' should also scroll down and reach its original position.

At the same time, 'leftDiv' should always remain fixed and should never scroll up or down ever.

And, 'rightDiv' should always scroll up and down with scrollbar as required natively.

So the question is, how do i track the movement of scroll bar up and down ?
What should be the proper css applied to each div ?


Thanks
Deepak Singh

Thad

unread,
Apr 17, 2012, 5:18:47 PM4/17/12
to google-we...@googlegroups.com
I would rewrite this as SplitLayoutPanel. <g:north> would be topDiv and a SimpleLayoutPanel. <g:west> would be leftDiv and a SimpleLayoutPanel. <g:center> would be rightDiv and a ScrollPanel or CustomScrollPanel.

It's a pain in the neck to get in place, but it does work.

Deepak Singh

unread,
Apr 17, 2012, 6:08:53 PM4/17/12
to google-we...@googlegroups.com
I want to use plain html only because in my whole project i have not used LayoutPanels, its only plain html with uibinders.
I believe the work can be achieved  with a bit of css only.

The first question is how to track the scroll movement by user?
And the 2nd question is what could be the best css to applied for each div ?

Thanks in advance
Deepak

--
You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group.
To view this discussion on the web visit https://groups.google.com/d/msg/google-web-toolkit/-/Y_Hx2bQDLBEJ.
To post to this group, send email to google-we...@googlegroups.com.
To unsubscribe from this group, send email to google-web-tool...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-web-toolkit?hl=en.



--
Deepak Singh

Aidan O'Kelly

unread,
Apr 17, 2012, 6:24:23 PM4/17/12
to google-we...@googlegroups.com

Deepak Singh

unread,
Apr 19, 2012, 2:20:20 PM4/19/12
to google-we...@googlegroups.com
I got to know about the scrollbar event but could not achieve the result as desired. Can anyone help me with css ?
--
Deepak Singh
Reply all
Reply to author
Forward
0 new messages