Semantic-ui: A problem in shape of SemanticUI

[zysdcyymyw]

I made a simple login page.
It has a div contains two .sides in it.
I put two buttons on the page,one is inside the shape and another is outside it.Both of them have a class named 'btn_reg'.
I wrote following code in the onready event of document:
$('.btn_reg').on('click',function(){
$('.shape').shape('flip left');
});
When I click the button outside the shape, the beautiful animation shows normally.
But when I click the button inside the shape, the animation disappears quickly.
I tested it in both Firefox and Chrome. But this problem exists in both of them.
The link of this problem is http://muncs.vipsinaapp.com/system/
What should I do to solve it?

[jlukic]

Please provide a JSfiddle with the minimum html required to recreate the layout issues. Removing your site specific code.

You can find a JSFiddle link to fork in the readme.

[zysdcyymyw]

http://jsfiddle.net/ayuqk4w7/1/

[zysdcyymyw]

@jlukic The JSfiddle link is over here,what should I do to make it work normally?

[jlukic]

I'll take a look tomorrow. However for now, it looks like just removing transition from the button fixes it as well.

http://jsfiddle.net/jcz03p0z/

[zysdcyymyw]

@jlukic Here is a page with more codes.The previous active side looks as if it disappears when I click the buttons.But sometimes it shows normally.

http://jsfiddle.net/pqwoocwr/

[jlukic]

I think this is related to a chrome bug, https://code.google.com/p/chromium/issues/detail?id=455240

Your code sample seems to work fine in FF.

[zysdcyymyw]

@jlukic But its transparency in Firefox also has some problems.The previous side is nearly transparent as soon as I click the button sometimes.It looks very strange.

[hmaesta]

I guess it's working fine here. Chrome 42.0.2311.152 (64-bit) OS X.

[jlukic]

Closing since I dont think theres a fix forthcoming.

[vnmone]

I have the same behaviour (not bug?)(chrome 49.0.2623.110)
Removing transition from button helps me.