This is a migrated thread and some comments may be shown as answers.

All popup containers don't subtract scrollTop from the offset top position when the scrollbar-y is on the body tag

2 Answers 158 Views
DropDownList
This is a migrated thread and some comments may be shown as answers.
Darlesson
Top achievements
Rank 1
Darlesson asked on 16 Apr 2012, 11:01 PM
The app that I am working on we have the BODY tag with vertical scrollbar. That is necessary to make the app to have a minimum height of 100% and make the footer to stick at the bottom when the content is not long enough to create a scrollbar. All that is being done without JavaScript (please see the attached files).

When the content is long enough to create a vertical scrollbar, if the page is scrolled down, kendo popups don't get the right position. This is happening because it is assumed that the HTML tag is the only one with scrollbars. The only browser that this assumption works anyways is Chrome. Firefox and Internet Explorer 7++ get the popup opened in the wrong position.

In the attached files I added a commented code in the line 1841 in kendo.core.js. Removing the comment will get the issue fixed. The code is shown below.

// Get scrolltop from HTML or Body (if it is not a frameset page)
var scrollTop = window.document.documentElement.scrollTop || (window.document.body) ? window.document.body.scrollTop : 0;
 
if(scrollTop > 0)
    result.top = result.top - scrollTop;

Issue replication steps:

1 - Open the default.htm page from the attached file in Internet Explorer or Firefox
2 - Resize your browser height to get a vertical scrollbar
3 - Scroll down
4 - Open the drop down

2 Answers, 1 is accepted

Sort by
0
Accepted
Kamen Bundev
Telerik team
answered on 19 Apr 2012, 04:46 PM
Hi Darlesson,

Thank you for noticing this. After further investigation seems that getBoundingClientRect() that jQuery uses returns different values in WebKit and all the other browsers. Most likely WebKit has an issue since the dropdown is absolutely positioned and the body shouldn't be an offsetParent for it. You can simply workaround this issue by setting position: relative to the body element (except for WebKit), like this:
body {
    position: relative;
}
:-webkit-any(body) {
    position: static;
}


While we are looking for a way to add a workaround for this in kendo.core. I've also updated your points for the find.

All the best,
Kamen Bundev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Swikar
Top achievements
Rank 1
answered on 19 Oct 2012, 03:23 AM
Thank you it worked for me!!
Tags
DropDownList
Asked by
Darlesson
Top achievements
Rank 1
Answers by
Kamen Bundev
Telerik team
Swikar
Top achievements
Rank 1
Share this question
or