Hello and welcome to our community! Is this your first visit?
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    Regular Coder
    Join Date
    Jun 2007
    Maryland, USA
    Thanked 0 Times in 0 Posts

    jQuery: mouseOver breaks each() loop

    Ok, here's the issue...

    I have a function that does 2 things. Each one works independently of the other, but they don't work together.

    First, the function grabs "rel" from ".thumb_li" and appends an img to #mids using its value.

    Then, it sets a rollover effect so that when you hover over ".thumb_li" it makes visible the linked img in #mids.

    so here's the code:

    function thumb_to_mid(target_items, name){
    		$("#mids").append("<img class='"+name+"' id='"+name+i+"' src='"+$(this).attr('rel')+"' alt='mid-sized image' />"); //add mid image to #mids
    		var my_mid_image = $("#"+name+i); //currently selected mid_image #id for this loop cycle
    		if($(this).attr("rel") != "" && $(this).attr("rel") != "undefined" ){ //check to make sure rel isn't blank, then:	
    			$(this).hover( function(){
    					$("."+name).animate({"opacity" :"0"}, 100); //fade out previous mid pic
    					$("."+name).css({"display" :"none"}); //hid previous mid pic
    					my_mid_image.css({"display" :"block"}); //show current mid pic
    					my_mid_image.animate({"opacity" :"1"}, 500); //fade in current mid pic
    So here's the problem. Adding the $(this).hover() command stops $(target_items).each() from applying to each target_item! It makes the loop stop after one pass.

    If I remove $(this).hover(), poof! The loop works again. But $(this).hover() does at least work for the one img that it allows to be appended!

    I can't figure out why $(this).hover() breaks the $(target_items).each() loop from finishing. Can anyone please help?

    Much appreciated!

  2. #2
    New Coder
    Join Date
    Jul 2008
    Thanked 6 Times in 6 Posts
    I'm having a hard time visualizing what you are actually trying to do. Can you put up your html?


Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts