वेबकिट ब्राउज़र के लिए ऑटोकंपलेट एक्स्टेंडर की गलत स्थिति है, पेज

Question

नीचे स्क्रॉल करने के बाद मेरे पास मेरे पृष्ठ पर एक ऑटोकंपलेट एक्स्टेंडर है जो ठीक काम करता है लेकिन जब मैं पृष्ठ को स्क्रॉल करता हूं और इसका उपयोग करता हूं, तो सुझाव गलत (लंबवत) स्थिति में दिखाई देते हैं।
यह सफारी & क्रोम के साथ होता है लेकिन आईई & एफएफ के साथ नहीं है और इसलिए मैंने सोचा कि यह वेबकिट की गलती हो सकती है।
यहाँ कोड:

<td> 
     <div style="position: relative;"> 
      <asp:TextBox ID="DepartureAirportTextBox" runat="server" CssClass="DepartureAirport airport-textbox" 
          onblur="javascript:DepartureLostFocus();" onkeydown="javascript:DepartureChanged(event);"></asp:TextBox> 
      <asp:Panel ID="DepartureAutocompleteDropDownPanel" runat="server" ScrollBars="Vertical" 
          CssClass="autocomplete-panel" Style="display: none;" /> 
      <AjaxControlToolkit:AutoCompleteExtender ID="DepartureAirportAutoComplete" runat="server" 
          TargetControlID="DepartureAirportTextBox" CompletionSetCount="200" ServicePath="../WebServices/SecureService.asmx" 
          ServiceMethod="ListAirports" MinimumPrefixLength="3" BehaviorID="DepartureAirport" 
          CompletionListElementID="DepartureAutocompleteDropDownPanel" OnClientItemSelected="SelectDepartureAirport" 
          OnClientPopulating="ShowDepartureIcon" OnClientPopulated="HideDepartureIcon"> 
      </AjaxControlToolkit:AutoCompleteExtender>    
    </div> 
</td> 

मैं इतने पर this & this समाधान की कोशिश की है, लेकिन कोई भी काम किया।
इसे कैसे ठीक करें?

अद्यतन:
माइक्रोसॉफ्ट से the simplest example भी इस समस्या में है। स्क्रॉल करने योग्य क्षेत्र बनाने और परीक्षण करने के लिए टेक्स्टबॉक्स & विस्तारक से पहले और उसके बाद कुछ <p> तत्व जोड़ें। GetCompletionList लिंक ऊपर से के लिए

<asp:TextBox ID="txtMovie" runat="server"></asp:TextBox> 
     <AjaxControlToolkit:AutoCompleteExtender ID="AutoCompleteExtender1" TargetControlID="txtMovie" 
      runat="server" UseContextKey="True" MinimumPrefixLength="2" ServiceMethod="GetCompletionList" /> 

कोड प्राप्त करें। यह मुद्दा इतनी आसानी से पुनरुत्पादित है।

Answer 1

मुझे solution on Asp.net forums मिला।

function resetPosition(object, args) { 
    var tb = object._element; 
    var tbposition = findPositionWithScrolling(tb); 
    var xposition = tbposition[0]; 
    var yposition = tbposition[1] + 20; // 22 textbox height 
    var ex = object._completionListElement; 
    if (ex) 
     $common.setLocation(ex, new Sys.UI.Point(xposition, yposition)); 
} 
function findPositionWithScrolling(oElement) { 
    if (typeof (oElement.offsetParent) != 'undefined') { 
     var originalElement = oElement; 
     for (var posX = 0, posY = 0; oElement; oElement = oElement.offsetParent) { 
      posX += oElement.offsetLeft; 
      posY += oElement.offsetTop; 
      if (oElement != originalElement && oElement != document.body && oElement != document.documentElement) { 
       posX -= oElement.scrollLeft; 
       posY -= oElement.scrollTop; 
      } 
     } 
     return [posX, posY]; 
    } else { 
     return [oElement.x, oElement.y]; 
    } 
} 

एक्सटेंडर के OnClientShown घटना पर कॉल resetPosition