How to set a CSS property with a variable in JQuery?


Tags: javascript,jquery,html,css

Problem :

I need to set the CSS property of width as the same size as the browser's current width. To do this, I did var setWidth = $(window).width(), but I don't know how to apply this to my current code, which is something like this:

$(document).ready(function(){
    $("#backgroundImg").css("width", ""); 
});

Is there any way to do this? I'm new to JQuery so I might just be really amateur.



Solution :

Try this

$(document).ready(function() {
    var setWidth = $(window).width();
    $("#backgroundImg").css("width", setWidth + 'px'); 
});

or you can use $.width

$(document).ready(function() {
    $('#backgroundImg').width( $(window).width() )
});

    CSS Howto..

    How is struts finding css files?

    How to solve css double hover issue? Making an image map

    How to select div with id nested in another div with class in css

    How do I change the color of Semantic UI icons?

    How do I get my HTML page to display in the browser without horizontal and vertical scroll bars?

    How to add transition to CSS3 Animation steps

    how to show images with it's original smoothness in IE

    HTML/CSS: how to put all
  • in
      on the same line and centered [duplicate]
  • Showing Div via CSS selector within a UL

    How to create the Facebook Status arrowed textbox?

    How to center [image + text] of unknown width?

    How to place items exactly where you want to CSS

    how to change the css in td on mouse click using javascript

    How to use CSS Overflow: hidden to avoid the parent container grow

    How can I skin / theme a windows forms application [closed]

    How to serve static files for local development in Django 1.4

    How to make text slide by only using css/html

    How do I align my navbar so it's permanently in the middle of my white box (without padding etc)?

    How to generate width CSS from JavaScript / C#

    How to make a div move smoothly?

    How to avoid ui-block div (jquery mobile) to overlap in internet explorer?

    How not to use body style css rule in part of html code?

    How to match an index of a CSS class with JavaScript?

    How to center my main navigation bar on my site with css?

    How to align this text in CSS?

    How to extract text from contenteditable div (but not html tags)

    How to make hover using jquery without CSS?

    How to animate a height change using javascript and css?

    How to make 1 table scrollable with fixed header without affecting other tables in Bootstrap

    How to center nested divs with rotation with CSS3?