Forum | Appery.io

Hi,

Since the update to Appery there has been some different behaviour with the Panel
object.

I use some CSS (as below) to set the panel height 60px less than the displayed image within the panel so that the buttons beneath the panel are displayed over the top of the image. (This enables me to maximise screen usage).

Since the update, the panel now cuts off at the height specified and displays my buttons beneath it.

Can you help me get this behaviour back please? My code is as follows (and the panel is called 'showcam'):

 // calculate image width and height based on screen size 
 // 
  imagewidthnum=screenwidth; 
  imageheightnum=screenwidth/1.22222; 
 // 
 // Calculate margin to centralise image 
 //     
 var marginnum = ((screenwidth - imagewidthnum) / 2); 
 var marginstr = marginnum.toString() + "px"; 
 Appery('showcam').css({'margin-left': marginstr}); 
 // 
 // Set back/forward buttons position overlapping image 
 // 
var buttonheight = imageheightnum-30; 
 $("[dsid=showcam]").css('height',buttonheight); 
 $("[dsid=showcam]").css('width',imagewidthnum); 

Hi Andy,

Could you please post a public link and tell us where we can find the issue?

Sure, the app is shared with a href="mailto:support@appery.io" rel="nofollow"support@appery.io/a and is called
MotorwayCamWatch

The code in question is in a javascript library called: handlecamerapage
The function is named: addmargintoHTMLpanel()

The "prev" and "next" buttons should be 60px up from the bottom of the image, instead the image is now cropped and the buttons are below.

The code that sets this is near the bottom of the function.
To test, you will need to select a motorway from the select list on the left, then select a junction from the select list next to it. A camera image will then be shown.

Andy,

We are testing. This will take some time.

Thanks, appreciate the assistance.

Hello! Could you clarify please where do you want these buttons (Prev and Next) show up? Cover top of image or show above image? Perhaps you can post some screenshot (move buttons the way you need in editor and make screenshot)?

Hi Maryna,

This is how the app looked prior to the Appery update, and how I need it to look after Many thanks again.

Thank you! I'll update.

1) For Prev and Next add class buttonOverImage separated by space so that it looks like this preclassButtonauto buttonOverImage/pre2) In CSS add pre.buttonOverImage {
position: relative;
top: -40px;
}/pre3) In addmargintoHTMLpanel function in handlecamerapage replace prevar buttonheight = imageheightnum-30;/pre with prevar buttonheight = imageheightnum+10;/pre

Many thanks Maryna,

I'll make the changes as soon as I can.