0

In an HTML document I've got some elements which need some javascript manipulations before showing up. To be more specific, their height and width must be adjusted based on user's window size.

The matter is that I want them appear already adjusted. The common way to adjust elements is to change their css properties via $(element).css() function in $(document).ready(), but, for many reasons, the execution of javascript may be delayed. This will cause the document display the wrong way first and then redraw correctly. To deal with that i'd like to change the classes of the elements before loading the elements.

Is there a way to directly operate with css classes, not with elements, in javascript and jquery? Editing inner html of <style> seems wrong and awkward to me.

ashpool
  • 179
  • 1
  • 8
  • Instead of adjusting with javascript, why not use css to adjust those dimensions based on window size? CSS has relative measures you can use, such as percentages, that allow you to do things like this. – kinakuta Apr 01 '14 at 15:02
  • is it ok for you to initially hide them by css `{ display: none; }` and show them after having resized the elements `.show()`? If it's based on client dimension, why do you use `.ready()` instead of `$(window).resize()`? – kpull1 Apr 01 '14 at 15:08
  • kpull, that is a good idea, actually. And, of course, I'll add `.resize()` handler as well. – ashpool Apr 01 '14 at 15:12

0 Answers0