CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Ozay34
Ozay34

Reputation: 107

getting css properties from classes with jquery

I have a set of div's generated by php, and they all have the same class. when I click one, it calls a jQuery function that gets its id (defined by MySQL database) and increases its size (height and width) by 110%. The problem i think I'm having, is when I retrieve its css properties by class, it gets the size of the first thing it sees with that class.

theres not much code to show, but its:

var height = parseInt($(".divClass").css("height"));
var width = parseInt($(".divClass").css("width"));

$(".divClass").css({"height":height + "px","width":width + "px"});
$("#" + id).css({"height":height * 1.1 + "px","width":width * 1.1 + "px"});

id is created when the function is called, and is the id of each individual div.

A: Am i even correct about my assumptions? B: How would i go about getting the css properties for the majority of elements with the same property instead of the first one. What is happening is when i click the first element, it, and the rest grow. Any help would be greatly appreciated.

Upvotes: 0

Views: 69

Answers (1)

Nathan Dawson
Nathan Dawson

Reputation: 19308

My suggestion would be to do:

var height, width;

$('.divClass').click(function() {
    height = $(this).height();
    width = $(this).width();

    $(this).css({ 'height': ( height * 1.1 ) + 'px', 'width': ( width * 1.1 ) + 'px' });
});

I haven't tested my code by the way so let me know how it works for you and I'll tweak as necessary.

Upvotes: 5

Related Questions