How to change css from javascripts


Tags: javascript,css,jquery-ui

Problem :

How can I change CSS from javascripts. Im using JQUERY (Dialog) and I want to change the style of a DIV from javascript.

Thanks



Solution :

Check out the jQuery documentation. If you want anything it will be there.

Anyhow, if you want to add styles to elements, you need to use the css function, which has a few variants.

$(selector).css(properties);  // option 1
$(selector).css(name, value); // option 2

So if you have a DIV with ID of "mydiv" and you want to make the background red, you would do

$("div#mydiv").css({'background-color' : 'red'}); // option 1
$("div#mydiv").css('background-color','red');     // option 2

The first way is easier if you're setting multiple things at once.

If you want to check what a property is currently set to, you would use a variant of the 2nd option, just omit the value.

var color = $("div#mydiv").css('background-color');

Would make the var color be red if you already set it above, for example.

You can also add and remove classes, doing something like

$(selector).addClass(class_name);
$(selector).removeClass(class_name);

    CSS Howto..

    How to convert a specific part of materialize.scss to css

    How to replace fixed values in responsible form css

    how to set anchor tag text width using css?

    jquery how to make an element comeback to initial position after animation

    How to add a background to a boostrap grid row (including padding!)?

    How can I use html tag in this javascript? [duplicate]

    How to add a third level to my CSS drop down menu

    How to scroll to bottom of div generated by ng-repeat Angular JS using JQuery?

    How can I caption an image inside a paragraph

    ?

    how to style php file with css + 1 more than one element

    CSS Speech bubbles: How to update the tip position based on where the bubble is

    How to make a Xul button bigger using css as it get focus?

    How to select two different elements with an XPath query

    How can I align divs in a row rather than vertically?

    how to set transform for div without effect on background image?

    How to overwrite styling in Twitter Bootstrap

    How to reference a .css file on a razor view?

    How to Make Auto Size Horizontal Line DIV using css?

    CSS breadcrumb - how to make radius small

    How to draw a half circle (border, outline only) [closed]

    How can I set the body color of a web page to the current width and height of the monitor?

    CSS / Javascript: hidden div does not take full width after being shown

    How can display table-row behave like colspan=3

    How to detect which part of page user is currently on, like on this page?

    How can I make the contents of a table cell overflow vertically without also expanding the table cells height?

    How to customize the HTML5 input range type looks using CSS?

    How to enforce input text to take 100% width of its parent

    Show button after login

    CSS: how to style to make text not wrap?

    how do i prevent respond.js reading my retina display media query?