Closed Bug 397736 Opened 14 years ago Closed 13 years ago
Firefox Drag + Overflow + Opacity Rendering Issue
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:18.104.22.168) Gecko/20070914 Firefox/22.214.171.124 Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:126.96.36.199) Gecko/20070914 Firefox/188.8.131.52 Ok, I have been trying to implement a semi-transparent draggable box, that has a content area with a fixed height + overflow (scroll / auto). Firefox has problems rendering the content that shows through the semi-transparent overflowed div. If opacity is set to 100%, then the issue no longer visible which I guess constitutes a possible solution, but if you want the draggable box to have any transparency then there is a problem. Removing the overflow rule, or setting it to visible or hidden stops the rending issue. Here is a demo page: http://buymeasoda.com/dev/issues/firefox_drag.html Drag the box around the page by the red drag handle and the content underneath is distorted as you drag. There are links on the demo page to change the overflow settings so you can see the box working correctly. I have tested this same scenario using jQuery + Interface and the same thing occurs in Firefox, so it's something to do with Firefox's rendering engine. IE has no problems rendering the box as it is dragged regardless of the overflow setting. Has anyone encountered this problem or found a workable solution? Reproducible: Always Steps to Reproduce: 1. create opaque draggable div, set overflow to auto 2. drag the div over text 3. note distortion Actual Results: distortion, performance hits Expected Results: If overflow of div is set to hidden, there's no distortion. overflow auto should do the same
Component: General → Drag and Drop
Product: Firefox → Core
Version: 2.0 Branch → unspecified
Also, as observed at: http://www.emanagers.de/ff3b5_bug/ and in my web application: http://shaped.ca/ff3-1.jpg http://shaped.ca/ff3-2.jpg http://shaped.ca/ff3-3.jpg http://shaped.ca/ff3-4.jpg The issue also seems to not occur if the opacified element does not have a background, as observed in the fourth screenshot.
Also see a thread on the issue: http://groups.google.com/group/mozilla.feedback.firefox/browse_thread/thread/77a0d0844fc05947 fix plz!
Basically Bug 302377 (that's the one on the radar to be fixed).
Status: UNCONFIRMED → RESOLVED
Closed: 13 years ago
Resolution: --- → DUPLICATE
Duplicate of bug: 302377
You need to log in before you can comment on or make changes to this bug.