0

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.

2
  • 1
    You need to show your click event handling. If you're trying to get the clicked element's CSS, use this (or $(this))
    – Ian
    Feb 22, 2014 at 17:24
  • Please provide a jsfiddle.net , and please try to reformulate your question. If you want to target the clicked Div, you should do it like Nathan Dawson said (no need to change style to all the elements of a class), if you want the average height of all the divs then is something else. With a jsfiddle we can help :)
    – Lu Roman
    Feb 22, 2014 at 18:33

1 Answer 1

5

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.

6
  • I noticed this was on click. I'll adjust accordingly now. Feb 22, 2014 at 17:25
  • Done. No ID is necessary when using "this" Feb 22, 2014 at 17:26
  • how would i call the function with onClick? Oh, nvm i just needed to reload the page
    – Ozay34
    Feb 22, 2014 at 17:28
  • You insert it in your JS. It uses a click handler so no onClick necessary. Feb 22, 2014 at 17:31
  • I just relised i have a bit more to the function, and first thing it does is call a .load() method which calls the rest of the function when it is finished, so i dont think this would work.
    – Ozay34
    Feb 22, 2014 at 17:37

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.