So I want to change the width of an element as the page gets bigger.
However, if the page width doubles i dont want the elements width to increase by double. I want the element to increase with diminishing returns. Anyone know how to do this?
Add a comment
|
1 Answer
You can achieve this with jQuery, basically you would check the size of your page and by that you should set width of your elements, for example If you are using jQuery, you can get the size of the window or the document using jQuery methods:
$(window).height(); // returns height of browser viewport
$(document).height(); // returns height of HTML document (same as pageHeight in screenshot)
$(window).width(); // returns width of browser viewport
$(document).width(); // returns width of HTML document (same as pageWidth in screenshot)
For screen size you can use the screen object in the following way:
screen.height;
screen.width;
There are methods you could use, and here is an example how you might set value of your element by depending of your page size:
var width = $(window).width();
$("#myElement").width(width) - 100;
I put a 100 there as a variable number, you can change it as you want to. I mean you can put a number whichever you want to just to get width of your element as you want it to be.
I hope this helps to you
