Forum | Appery.io

Hi Ellen,

As we can see in your first screenshot you paste code in console but do not select a needed iframe here:

As soon as you select an iframe you can paste code in console and test.

Could you please clarify whether you take the first screenshot after you added code to Page Show event, or do you paste it straight away?

This is what I get when I change the iframe.

The code was added in the editor. Then I went to test it and pasted the same code in the console.

I noticed that even in the editor, the buttons aren't centered. The margins of the buttons and the grid are still the default.

Hello,

Please try this code:

pre

var MakeAction = function(){
var grid = Appery('buttons_grid');
grid.css({
top: '50%',
position: 'absolute',
width: '100%',
left: 0,
'margin-top': -( grid.outerHeight() / 2 )
});
alert("positionChanged");
};
$(window).bind('orientationchange', function(e) {
MakeAction();
});
MakeAction();

/pre

This code has debug alert that you should see after grid will be aligned.

So after change orientation you should see this alert too.

Regards.

I got the notification but it didn't seem to actually change the position. I don't know if this will help you or not, but my app is already shared with you from previous cases. It is called the Calving Book.

Hi Ellen,

Please describe where you have this notifications (alert)?

Given code should work before change orientation, does it?

Regards.

The notification part works fine and it notifies me before the orientation change. The only problem is that it doesn't center the buttons.

Ok, please give us your app public link and describe steps to reproduce this problem.

Regards.

Sign on when you see the first screen (username: jane password:123)
On the next page you will notice that in the footer, the three buttons are not centered like they should be.
http://appery.io/app/mobile-frame?src...

Hi Ellen,

I seems you just need to center your content in the grid.

For this goal:

1 Comment all code you did for this purpose.

2 Add "page show" event handler for "screen1" page.

3 Populate it with following code:

pre

Apperyio("mobilegrid_267").find("td").attr("align", "center")

/pre

Regards.