marieall
Posts: 0
Joined: Thu Oct 03, 2013 4:10 pm

How do I set the proportions of my home page's grids in percentage?

Hi Katya,

Thank you.
But I am not sure to which component you are referring to..
I tried with the 'initialcontainer' and with the 'mobilecontainer' but nothing works...

Here is what I did, let me know if I misunderstood something..
1)I put JS on page loading:
var screenH = Appery("Screen").height();
Appery("initialcontainer").css("height", screenH);

2)on the page UI, I set width and height in pixels

Image

Kateryna Grynko
Posts: 0
Joined: Thu Nov 15, 2012 9:13 am

How do I set the proportions of my home page's grids in percentage?

Marie,

Did you test this on Android 4.2.2? Did you try this on another device?

marieall
Posts: 0
Joined: Thu Oct 03, 2013 4:10 pm

How do I set the proportions of my home page's grids in percentage?

Hi,

I tested it on a samsung with Android 4.2.2 and on a Nexus 7 tablet (which is supposed to have the latest android version). Both are not working.

Kateryna Grynko
Posts: 0
Joined: Thu Nov 15, 2012 9:13 am

How do I set the proportions of my home page's grids in percentage?

Hi Marie,

Add custom JS code:prefunction myres(component) {
var screenH = $($("[data-role=page]")[0]).height();
var ch = screenH / 440;
component.height(component.height() * ch);
}/pre

And on Page Show use this event:prevar arr = $("img");
arr.each(function(e){
myres($(arr[e]));
});/pre

Maryna Brodina
Posts: 0
Joined: Thu Apr 05, 2012 7:27 am

How do I set the proportions of my home page's grids in percentage?

Hello! It's incorrect to define function on page Load event, but use it on page Show. Use the following code on page Show event prevar screenH = $("[data-role=page]").eq(0).height();
var ch = screenH / 480;
$("img", $.mobile.activePage).each(function(e){
var $this = $(this), h = $this.height();
$this.height(h*ch);
});/pre

marieall
Posts: 0
Joined: Thu Oct 03, 2013 4:10 pm

How do I set the proportions of my home page's grids in percentage?

Hi,

This is not working either.
Maybe I don't understand how to proceed exactly... and I'm sorry but I'm beginning to be annoyed by the fact that it looks like your messages doesn't follow each other, I'm lost between your different advices:
What part of code should I keep from each advices, are they completly different advices, do i just have to copy and paste the code where you told me, or are there amendments to do?
Please note I don't know anything about JS.

Honnestly I'm really frustrated and thinking of resigning from Appery your replies are too often too vague...

So is someone able to re-read the whole thread and explain me precisely what should I do?

Thanks a lot,

Maryna Brodina
Posts: 0
Joined: Thu Apr 05, 2012 7:27 am

How do I set the proportions of my home page's grids in percentage?

Hello! Are we talking about shared FlyingWithRyan app and APage_Accueil screen? As we can see you have done everything correctly. Note you have to refresh page (upper left button) after you applied new screen size. It also should work on device. Could you clarify on what device with what dimension it doesn't work? Do you install app on device or test in browser?

marieall
Posts: 0
Joined: Thu Oct 03, 2013 4:10 pm

How do I set the proportions of my home page's grids in percentage?

Hi Maryna,

Ok I understand the refreshing part for the test in browser.
But I install it on a device Android 4.4, a Nexus 7. On opening it displays OK (I just have to correct the size of images, I'll check that myself after), but when I go to a section, for example "Airports" and then come back to home page, the proportions are not right, it looks like the page have been stretched on a height base. (see printscreen). I guess it must have something to do with the Js you advised me to set.
I have to quit the application and restart it to get the right proportions back.

Do you have an idea why?

Image Image

Kateryna Grynko
Posts: 0
Joined: Thu Nov 15, 2012 9:13 am

How do I set the proportions of my home page's grids in percentage?

Hi,

Sorry, my bad. Run this code on Load event instead of Page show.

Return to “Issues”