Additional Blogs by Members
cancel
Showing results for 
Search instead for 
Did you mean: 
former_member188598
Contributor
0 Kudos

I recently faced an issue, where the buttons of my application
were getting cut off (hiding from the right side) in the page layout on
resizing the Portal browser window. I tried to fiddle around with the width field
in my html/jsp page but somehow the changes never worked inside the Portal Page Layout. I had 2 options,either to fix my layout so that it doesn't shrink at all or to make my buttons resizable on window resize.

!https://weblogs.sdn.sap.com/weblogs/images/251824621/screen_withoutscript.PNG|height=175|alt=|width=...!

I implemented the other approach i.e
to make the buttons shrink to fit the window screen resize using a simple
Javascript mentioned below:

 Since resizing images are simpler, I used an IMG tag and called the Javascript  resizeImage()

on the onresize event within
both and tag. The button submit functionality can be implemented on the onClick event of the .

 





!|onresize=resizeImage()|onclick=yourFunction()|src=!">





 

+The below JavaScript
works well but in case of using a button inside a table, you might need to
tweak around with html tags so that the layout is proper+.

 

function resizeImage()



{



      var
window_height = document.body.clientHeight;



      var
window_width  =
document.body.clientWidth;



      var
image_width   = document.images[0].width;



      var
image_height  = document.images[0].height;



      var
height_ratio  = image_height /
window_height;



      var
width_ratio   = image_width /
window_width;



      if
(height_ratio > width_ratio)



      {



            var i,L=document.images.length;



 



+/* As I have multiple img buttons I used a for loop

*/</p><p>for(i=0;i<L;+i){<br /></p>