Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Grid menu animation issue in Firefox #3978

Closed
rquiroz6 opened this issue Jul 14, 2015 · 8 comments
Closed

Grid menu animation issue in Firefox #3978

rquiroz6 opened this issue Jul 14, 2015 · 8 comments

Comments

@rquiroz6
Copy link

When closing the grid menu in Firefox 39.0, the menu's fly-out animation gets 'stuck' above the grid, as seen in this screenshot:

firefoxuigridmenu

This issue occurs with the column menus as well.

@fberthel
Copy link

I can confirm this bug persists in Firefox 40.0.2 and Firefox Developer Edition 42.0a2 (2015-08-18).

@tringuyenminh92
Copy link

i got this issue in FF ESR 38.2.0
i am using * ui-grid - v3.0.4 - 2015-08-13, AngularJS v1.4.5

@susharma-equinix
Copy link

I am also facing the same issue.
Can some one please look into this at the earliest.
This is causing entire look of the page to go biased.

@hohwille
Copy link

hohwille commented Oct 7, 2015

http://ui-grid.info/docs/#/tutorial/121_grid_menu
Still buggy in FF 41.0.1

@hohwille
Copy link

hohwille commented Oct 7, 2015

http://ui-grid.info/
also the regular sort menus do not work with FF. Only working with Chorme.
IE also works but without annimaiton.

Better disable animation gimmicks in FF than having this broken stuff.

@SoundLogic
Copy link

any easy fix in the meantime is to do the following in your app.js file (requires ngAnimate module):

    app.config([
        '$animateProvider', function($animateProvider) {
            $animateProvider.classNameFilter(/^((?!(ui-grid-menu)).)*$/);
        }
    ]);

@veegandhi
Copy link

Run into the same issue , @SoundLogic solution works

@fberthel
Copy link

@SoundLogic works like a charm, thanks :)

caseyjhol added a commit to snapappointments/ui-grid that referenced this issue Mar 3, 2018
Since v3.0.0-rc.21, the column/grid menu animation slides down from
above the grid, but it is visible the entire time. This causes the
animation to appear clunky. This has been resolved by setting `overflow:
hidden` on the menu.

Fixes angular-ui#3436, angular-ui#3921, angular-ui#3978.

Showing/hiding the menu can seem slow. The menu animation has been sped
up as well, and when it is hidden, the animation is now twice as fast.

Previously, to calculate the menu position, the width of the menu needed
to be calculated, which meant calling `repositionMenu` twice - once when
first opening the menu, and again after the menu is visible to allow the
width of the menu to be determined. This also meant there was always a
"shift" when the menu was first opened (as a default width of 170px was
used until the actual width of the menu could be determined. This
implements the CSS trick `right: 100%` so the width is not needed when
determining the menu's position, meaning the menu can be opened much
more smoothly and without needing to call `repositionMenu` twice.

Fixes angular-ui#6587.
caseyjhol added a commit to snapappointments/ui-grid that referenced this issue Mar 3, 2018
Since v3.0.0-rc.21, the column/grid menu animation slides down from
above the grid, but it is visible the entire time. This causes the
animation to appear clunky. This has been resolved by setting `overflow:
hidden` on the menu.

Fixes angular-ui#3436, angular-ui#3921, angular-ui#3978.

Showing/hiding the menu can seem slow. The menu animation has been sped
up as well, and when it is hidden, the animation is now twice as fast.

Previously, to calculate the menu position, the width of the menu needed
to be calculated, which meant calling `repositionMenu` twice - once when
first opening the menu, and again after the menu is visible to allow the
width of the menu to be determined. This also meant there was always a
"shift" when the menu was first opened (as a default width of 170px was
used until the actual width of the menu could be determined. This
implements the CSS trick `right: 100%` so the width is not needed when
determining the menu's position, meaning the menu can be opened much
more smoothly and without needing to call `repositionMenu` twice.

Fixes angular-ui#6587.

remove lastMenuWidth from tests
caseyjhol added a commit to snapappointments/ui-grid that referenced this issue Mar 3, 2018
Since v3.0.0-rc.21, the column/grid menu animation slides down from
above the grid, but it is visible the entire time. This causes the
animation to appear clunky. This has been resolved by setting `overflow:
hidden` on the menu.

Fixes angular-ui#3436, angular-ui#3921, angular-ui#3978.

Showing/hiding the menu can seem slow. The menu animation has been sped
up as well, and when it is hidden, the animation is now twice as fast.

Previously, to calculate the menu position, the width of the menu needed
to be calculated, which meant calling `repositionMenu` twice - once when
first opening the menu, and again after the menu is visible to allow the
width of the menu to be determined. This also meant there was always a
"shift" when the menu was first opened (as a default width of 170px was
used until the actual width of the menu could be determined. This
implements the CSS trick `right: 100%` so the width is not needed when
determining the menu's position, meaning the menu can be opened much
more smoothly and without needing to call `repositionMenu` twice.

Fixes angular-ui#6587.

remove lastMenuWidth from tests

no message
mportuga pushed a commit that referenced this issue Mar 5, 2018
Since v3.0.0-rc.21, the column/grid menu animation slides down from
above the grid, but it is visible the entire time. This causes the
animation to appear clunky. This has been resolved by setting `overflow:
hidden` on the menu.

Fixes #3436, #3921, #3978.

Showing/hiding the menu can seem slow. The menu animation has been sped
up as well, and when it is hidden, the animation is now twice as fast.

Previously, to calculate the menu position, the width of the menu needed
to be calculated, which meant calling `repositionMenu` twice - once when
first opening the menu, and again after the menu is visible to allow the
width of the menu to be determined. This also meant there was always a
"shift" when the menu was first opened (as a default width of 170px was
used until the actual width of the menu could be determined. This
implements the CSS trick `right: 100%` so the width is not needed when
determining the menu's position, meaning the menu can be opened much
more smoothly and without needing to call `repositionMenu` twice.

Fixes #6587.

remove lastMenuWidth from tests

no message
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

9 participants