WebKit Bugzilla
New
Browse
Log In
×
Sign in with GitHub
or
Remember my login
Create Account
·
Forgot Password
Forgotten password account recovery
NEW
50552
strange behavior of inputs/select after transfrom3d - scroll body and statusbar
https://bugs.webkit.org/show_bug.cgi?id=50552
Summary
strange behavior of inputs/select after transfrom3d - scroll body and statusbar
tomaszw
Reported
2010-12-05 23:35:17 PST
<select> control that is invisible in time of "transfrom3d" execution, make strange behavior after click (move body tag for several pixels, as well as status bar) quick reproduction: 1. create two divs, float lefts, inline-block in one large div 2. apply overflow:hidden on body 3. make transfrom3d with negative value (scroll div container left) example code below <style> body { -webkit-transform-style: preserve-3d; -webkit-transform: perspective(-900); width:1200px; overflow: hidden; } #pages { width:5000px; overflow: hidden; display: inline-block; } #page1,#page2 { width:1300px; float:left; display:inline-block; } input, select, select:focus, input:focus, textarea { -webkit-transform: scale(1,1); } </style> <script> function scrollleft() { document.getElementById('pages').style.webkitTransform = 'translate3d(-1300px, 0, 0)'; } </script> <html> <button onclick="scrollleft()">lewo</button> <br> <div id="pages" name="pages" > <div id="page1"> this is page 1 <select> <option>1123123</option> <option>123</option> <option>123</option> </select> </div> <div id="page2"> this is page 2 <select> <option>1</option> <option>123</option> <option>123</option> </select> </div> </div> </html>
Attachments
Testcase
(1.17 KB, text/html)
2010-12-06 11:44 PST
,
Simon Fraser (smfr)
no flags
Details
test script
(1.17 KB, text/html)
2010-12-06 12:21 PST
,
tomaszw
no flags
Details
before scroll
(52.79 KB, image/png)
2010-12-06 12:22 PST
,
tomaszw
no flags
Details
after scroll
(47.75 KB, image/png)
2010-12-06 12:22 PST
,
tomaszw
no flags
Details
after select
(58.76 KB, image/png)
2010-12-06 12:22 PST
,
tomaszw
no flags
Details
View All
Add attachment
proposed patch, testcase, etc.
tomaszw
Comment 1
2010-12-05 23:36:32 PST
just click button to scroll pages
Simon Fraser (smfr)
Comment 2
2010-12-06 11:44:09 PST
Created
attachment 75717
[details]
Testcase Attached testcases are much more useful than markup pasted into comments, since they can be run directly.
Simon Fraser (smfr)
Comment 3
2010-12-06 11:46:02 PST
By "strange behavior" do you just mean the temporary jump, or something more?
tomaszw
Comment 4
2010-12-06 12:21:44 PST
Created
attachment 75722
[details]
test script 1. make browser width to less than 1000; 2. open page (test script) 3. push "left" button 4. click on second <select> (right side of page) 5. the select component will fly to the left, values will be listed outside of the browser (see attachments before_left and after_left and after_click)
tomaszw
Comment 5
2010-12-06 12:22:10 PST
Created
attachment 75723
[details]
before scroll
tomaszw
Comment 6
2010-12-06 12:22:39 PST
Created
attachment 75724
[details]
after scroll
tomaszw
Comment 7
2010-12-06 12:22:57 PST
Created
attachment 75725
[details]
after select
Devin Rhode
Comment 8
2012-01-17 08:54:37 PST
I would suspect this is somewhat related to this bug:
https://bugs.webkit.org/show_bug.cgi?id=31852
but I'm not sure. Just wanted to key you in
Simon Fraser (smfr)
Comment 9
2012-01-17 09:12:58 PST
Not related. This is happening because the focus ring causes layer sizes to change, and the huge tiled layer is drawing asynchronously.
Note
You need to
log in
before you can comment on or make changes to this bug.
Top of Page
Format For Printing
XML
Clone This Bug