How to access the different objects using jQuery?

Question

I have developed some code for image sliding in which whenever a mouse event occurs I want the id of the other div except on which the mouse is present.

My code is:

$('#div1,#div2,#div3,#div4,#div5,#div6').mouseover(function () {
    $('#div1,#div2,#div3,#div4,#div5,#div6').css('width', '100px')
    $("." + $(this).data('class')).animate({                   
        'width':"400px",                   
    }, {
        'duration':1500,
        easing:'easeOutBack',
    })
});

Can you provide an example of your problem. It's not very clear in your question. Also, a description of why the code you have doesn't work would be helpful. — Rory McCrossan
– Rory McCrossan, Commented Feb 5, 2013 at 9:54
@Dineshkani Why on earth would you do that? this is already the element you want, re-selecting it using its id property makes no sense. — Anthony Grist
– Anthony Grist, Commented Feb 5, 2013 at 10:02

Undefined · Accepted Answer · 2013-02-08 17:14:10Z

1

I would suggest altering this to use classes rather than ids. It would make your code much neater.

Give every element that you want to have this effect a class of animated and try this code instead.

$('.animated').mouseover(function () {
  $(this).removeClass('animated');
  $('.animated').css('width', '100px')
  $(this)
    .addClass('animated')
    .animate({                   
      'width':"400px",                   
    }, 1500);
});

Here is an example showing it in action. Although I don't think your code does what you want it to.

edited Feb 8, 2013 at 17:14

answered Feb 5, 2013 at 9:56

Undefined

11.4k5 gold badges40 silver badges62 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Kevin Bowersox · Accepted Answer · 2013-02-05 09:55:18Z

0

Use .not to remove the hovered over div from the set of matched elements.

$('#div1,#div2,#div3,#div4,#div5,#div6').mouseover(function () {
    $('#div1,#div2,#div3,#div4,#div5,#div6').not(this).css('width', '100px')
    $("." + $(this).data('class')).animate({                   
                    'width':"400px",                   
                }, {
                    'duration':1500,
                    easing:'easeOutBack',
                })
    });

On a side note, it would be cleaner to use a class selector in this situation.

answered Feb 5, 2013 at 9:55

Kevin Bowersox

94.6k19 gold badges164 silver badges198 bronze badges

Comments

Talha Akbar · Accepted Answer · 2013-02-05 09:59:02Z

0

$( function() {
$("[id^=div]").mouseover( function() {
  var my = $(this).attr("id");
  var id = new Array;
  $("[id^=div]").each( function() {
    if($(this).attr("id") != my) {
       id.push($(this).attr("id"));
    }
  });
});
});

Working Fiddle or Demonstration

You can access each and every property.

I have taken all ids and added all ids to array id. You can access it further in your function.

answered Feb 5, 2013 at 9:59

Talha Akbar

10.1k7 gold badges42 silver badges62 bronze badges

Collectives™ on Stack Overflow

How to access the different objects using jQuery?

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related