CODEWITHSUNDEEP
javascriptjqueryhtml
Sheehan Alam
Sheehan Alam

Reputation: 60909

Why isn't my div position getting dynamically calculated?

I have the jQuery:

$('img[title*=\"Show\"]').live('click', function(e) {
    //$e.preventDefault();
     e.stopImmediatePropagation();      
    var position = $('img[title*=\"Show\"]').parent().position();
    $('#popover').css('top', position.top + $('img[title*=\"Show\"]').parent().height());
    console.log(position);
    $('#popover').fadeToggle('fast');
    if ($('img[title*=\"Show\"]').hasClass('active')) {
      $(this).removeClass('active');
    } else {
      $('img[title*=\"Show\"]').addClass('active');
    }
  });

I have two images titled "Show Options."

The popover div appears properly when I click on the first image.

When I click on the 2nd image, the popover appears underneath the first image.

I want it to appear underneath the 2nd image.

Why is this?

Upvotes: 0

Views: 76

Answers (2)

Kevin Holditch
Kevin Holditch

Reputation: 5303

I think you need to change the 3rd line to:

Var position = $(this).parent().position();

When your event handler is called $(this) will refer to the element that was clicked on.

Upvotes: 0

Pa.M
Pa.M

Reputation: 1402

try using offset instead of position

  $(this).parent().offset();

you will also have to use "this" instead of the ID as it will always match the first pic

Upvotes: 1

Related Questions