Is it OK to use JavaScript to reposition elements when window is resized?

Question

I am trying to accomplish a positioning scheme that is hard with CSS alone. I could do it easily with JavaScript, using something like:

function onWindowResize(new_width,new_height){
    $('#element')
       .css({  left: some_function(new_width),
               top: another_function(new_height) });
};

Is it OK to use that approach? What would be possible drawbacks?

Make sure to throttle the resize event so that you aren't performing an expensive operation dozens/hundreds of times during the resize: http://stackoverflow.com/questions/5489946/jquery-how-to-wait-for-the-end-or-resize-event-and-only-than-perform-action — Tim M., Sep 21 '12 at 23:10

score 4 · Accepted Answer · answered Sep 21 '12 at 23:07

Sure, it's perfectly fine to do it with javascript if you want. Some resize operations require more complicated logic than can be expressed in pure CSS.

In many cases, it can be done with pure CSS too. If you show us what you were really trying to accomplish, you might get some CSS-only suggestions.

Potential drawbacks:

Your page requires javascript in order to function properly (not much of an issue these days in my opinion).
The layout may not track quite as smoothly during resizing of the window compared to a CSS only solution.

score 1 · Answer 2 · answered Sep 21 '12 at 23:07

1

Two drawbacks:

Won't work if user has JS disabled
Ties your layout to your JS, preferable to keep it in CSS

answered Sep 21 '12 at 23:07

Ruan Mendes

90,375
31
153
217

Edit: understood the message above wrong (read as: 'Downvoting. Please explain') – MaiaVictor Sep 21 '12 at 23:20

Is it OK to use JavaScript to reposition elements when window is resized?

2 Answers2