I want to change the dimensions of a set of elements that are not created yet. They will be created by a JavaScript script that I don't have access to. JQuery's css() function would apply the changes only on existing items, while I want the code to work like if I had set CSS properties in a CSS file.
Can anyone help me do it?
To change the styles of all elements with a specific class: Use the querySelectorAll() method to get a collection of the elements with the specific class. Use the forEach() method to iterate over the collection. On each iteration, use the style object to change the element's styles.
Set Style Using element. One can use element. className to change various style parameters of an HTML element by clubbing those as a class and assigning the class name to the selected element with element. className .
Transform property in CSS is invoked when there is a change in the state of the HTML element. You can rotate, skew, move and scale elements. It occurs when the state of an element is modified, like when you hover the mouse over a button or perform a mouse-click.
One option would be to dynamically create a style element:
$("<style type='text/css'> .redbold{ color:#f00; font-weight:bold;} </style>").appendTo("head")
$("<div/>").addClass("redbold").appendTo("body");
Taken from here: Create a CSS rule / class with jQuery at runtime.
Here's a possible IE alternative (see Creating a CSS class in jQuery):
document.styleSheets[0].addRule('body', 'background: green', -1);
For reference, see the documentation for addRule.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With