1. #1
    Sencha User
    Join Date
    Oct 2009
    Posts
    95
    Vote Rating
    1
    Albareto is on a distinguished road

      0  

    Default DatePicker not positioning correctly in Chrome and showing a white mask.

    DatePicker not positioning correctly in Chrome and showing a white mask.


    I have a DatePicker (new Ext.DatePicker) in a form (html, not ExtJS) and when showing the component (I have attached a function to the show event) I move it in the screen to fit the correct position. This seems to work in IE, FF and Safari but not in Chrome (using latest version, 20.something), this is very weird because when I try to inspect the element with the inspector it automatically moves it to the correct position.

    So check the images, with FF happens this:
    FF.png
    Which is correct.

    Then with Chrome it shows it under the date field, making my screen bigger, ok, no problem as far as it is visible:
    chrome1.png

    The problem is that when I hover the DatePicker gets white:
    chrome2_hocer.png

    And if I click in the developer tools it moves to the correct position and removes the white thing, this is extremely weird and annoying, I cannot really debug what's going on or why is doing that.


    chrome3.png

    Do someone knows where is this white thing coming from or why the DatePicker is not positioning correctly?

    This is the code I use to position it:

    Code:
    show : function (datePicker)
                {
                    var content = Ext.get('Content');
                          h = content.getHeight(),
                            w = content.getWidth(),
                            tar = Ext.get('pos'+target.id),
                            tarPosTop = tar.getTop(),
                            tarPosLeft = tar.getLeft(),
                            dpEl = datePicker.getEl(),
                            dpWidth = dpEl.getWidth(),
                            dpHeight = dpEl.getHeight();
    
                        if (tarPosTop + dpHeight > h)
                        {
                            datePicker.getEl().setY((h - dpHeight));
                        }
                        else if (Ext.isChrome)
                        {
                            datePicker.getEl().setY(tarPosTop);
                        }
                        if (tarPosLeft + dpWidth > w)
                        {
                            datePicker.getEl().setX((tarPosLeft - dpWidth));
                        }
                        else
                        {
                            datePicker.getEl().setX(tarPosLeft + 30);
                        }
                    }
                }
    You can already see that there is some tricking for Chrome. This code works correct for IE, FF and Safari, and AFAIK this was working in the past also with Chrome but somehow it's stopped working.
    I have tried things like setStyle instead of setX and setY and also focus() just in case was a strange issue with focusing but result is the same. I think that the main problem is in the positioning, once it is in the correct position it does not show this white mask, so if there is any way of forcing the element to pick some position might help.

    Any help would be much appreciated.

  2. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,912
    Vote Rating
    443
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    Are you using 3.4? Please provide a small working example that we can use to verify. It seems you are making adjustments.

    Scott.

Thread Participants: 1

Tags for this Thread

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi