hopscotch icon indicating copy to clipboard operation
hopscotch copied to clipboard

Large Elements No Scrolling To Bring Into View

Open sganz opened this issue 8 years ago • 2 comments

Great project!

I have been playing with hopscotch and found something interesting, not really a bug but something that took a bit to figure out.

I had a large grid (well actually a table generated by a grid component). I wanted to have the bubble show on the bottom of the table to show the pager component. So the bubble does work and show up at the bottom but it does not force the scrolling of the page to bring the bubble into view. I'm guessing that the size of the large div that extends off screen is the issue.

A component generates the code dynamically so I can't put an ID on much of the internal elements that are generated so I just display the bubble on the bottom of the large DIV that encases the grid view.

Hope this makes sense.

Using Release v0.2.5

Sandy

sganz avatar Oct 02 '15 18:10 sganz

Ah crumbs... yeah, looks like the logic in adjustWindowScroll() takes the top of the bubble or element being targeted (whichever is higher up on the page) and uses that as the basis for where to scroll to. It doesn't take into account that the bubble might be at the bottom of a really tall element. Normally, I'd recommend targeting an internal element as a workaround, but as you mentioned that might not be possible. =/

Marking this as a bug, targeting the 0.3.0 milestone. Thanks for the report!

timlindvall avatar Oct 02 '15 21:10 timlindvall

Yeah, that is what I was trying to do by adding ID's to the internal components, but couldn't inject any ID's into the generated code without hacking up the component (that I didn't write). All good I cheated by just adding a blank div with an ID right after the grid and it seems to get around the problem.

Keep up the good work!

Sandy

sganz avatar Oct 02 '15 22:10 sganz