Using YUI in Javascript, How do I draw overlays on datatable/ScrollingDataTable?

Question

I need to draw overlays spanning one or more rows on YUI datatable/scrollingdatable based on the mouse activity ( drag and drop ).

I have no issues with drawing overlays on top of datatable.

But I want the overlays to be moving along with the rows when I scroll the datatable. As of now after drawing the overlays they remain static irrespective of the movement of the datatable scrollbar?

Answer 1

You can align your overlay to a specific dom element using the context property. It sounds like this is what you want to do. There is more information about this in the Overlay documentation.

Your code would look something like this:

var myOverlay = new YAHOO.widget.Overlay("myOverlay", {
    context: ['cellId', 'tl', 'bl']
});

This would anchor the top left (tl) corner of the overlay to the bottom left (bl) corner of 'cellId', where 'cellId' is some element in the table row that you want to align with.