Home/ Questions/Q 8514921
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-11T05:00:07+00:00

I’ve got this jsfiddle set up with my issue: http://jsfiddle.net/7MjN6/ As you can see,

  • 0

I’ve got this jsfiddle set up with my issue: http://jsfiddle.net/7MjN6/

As you can see, I have two images. I want the divs surrounding each to expand when each is clicked on. I’m attempting to use the this object to ensure that clicking on an image only expands that image’s div, but I’m sure I’m using this wrong because it’s not connecting. It would be much appreciated if someone could take a stab at my fiddle!

HTML:

<body>
    <div class="img-container">
        <a href="#"><img src="http://blueantlabs.com/wp-content/themes/blueantplate/img/port-wide/thefutureproject-605.png" /></a>
    </div>
    <div class="img-container">
        <a href="#"><img src="http://blueantlabs.com/wp-content/themes/blueantplate/img/port-wide/thefutureproject-605.png" /></a>
    </div>
</body>​

JS:

$(function(){
    $('.img-container').each(function(index){
        var imgHeight = $(" a img").height();
        $('a').click(function(e){
            e.preventDefault;
            $('div').animate({height: imgHeight});
        });
    });     
});​
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Try this approach. You don’t need the .each at all:

    $(function() {
    $('a').click(function(e) {
        var imgHeight = $(this).find('img').height(); // use "this", find the img inside
        e.preventDefault(); // this is a method, must use parentheses
        $(this).parent().animate({ // "this" is the anchor; move up to the parent
            height: imgHeight
        });
    });
});​

    http://jsfiddle.net/mblase75/7MjN6/4/

    • 0