ansaurus

Question

How to modify the CSS Properties (height width) of a div element via JQuery?

Answer 1

A:

Instead of left: $(window).width - 5, you could try right: 0.

EDIT: Yeah, that was pretty stupid. But, if I'm not mistaken, those should also be quoted, as in 'width': '5px',.

  $("#scrollBar").css({
    'height': $(window).height(),
    'width': '5px',
    'position': 'absolute',
    'top': 0,
    'right': 0,
    'margin': 0
  });

theIV 2009-08-20 02:08:41

Answer 2

+1 A:

Also note that jQuery's .width and .height should be .width() and .height().

Examples of use...

Jonathan Sampson 2009-08-20 02:10:55

Answer 3

+1 A:

you might want to put "5px" instead of 5 for the width and $(window).height() + "px" for the height and ($(window).width() - 5) + "px" for the left.

John Boker 2009-08-20 02:10:59

Answer 4

+6 A:

Use this instead:

I found several problems:

instead of $(window).height, use $(window).height()

instead of left: $(window).width - 5, use right: 0

$(document).ready(function() {
    $("#scrollBar").css({
        height: $(window).height(),
        width: 5,
        position: "absolute",                
        top: 0,
        right: 0,
        margin: 0
    });
});

Randell 2009-08-20 02:12:33

The only problem with 'right' is that IE often mucks it up and is 1px off.

Pat 2009-08-20 02:16:36

Would padding/margin help? I don't have IE right now so I can't test it.

Randell 2009-08-20 02:24:33

tested on ie8.works.

krishna 2009-08-20 02:55:45

Answer 5

A:

From reading jQuery documentation you can see that you need to put the css properties and their values as string values.

 $("#scrollBar").css({
                'height': $(window).height(),
                'width': '5px',
                'position': 'absolute',                
                'top': '0',
                'left': $(window).width() - 5,
                'margin': '0'
            });

http://docs.jquery.com/CSS/css#properties

I'm not really sure tough how you would display those calculated values.

PS: Jonathas was right height and width are functions, not properties.

Guilherme 2009-08-20 02:12:51

ansaurus

tags:

views:

answers:

How to modify the CSS Properties (height width) of a div element via JQuery?

related questions