Rebind click event

Question

i've got a question very similiar to this one: Rebind but i don't understand the solution.

I have a carousel for sliding html content left and right... with left and right images for sliding the content. If the end of the carousel is reached, the click event on the right sliding image should unbound. If one clicks the left image, the click event for the right image should be bounded again... Rebinding it like below doesn't seem to work. It seems that i should store a reference to the click event but i can't get it right.

$(document).ready(function() {  

         //when user clicks the image for sliding right  
        $('#right_scroll img').click(function(){  

            // code for sliding content to the right, unless end is reached

                if($('#carousel_ul li:first').attr('id') == fifth_lli){ // end carousel is reached

                $('#right_scroll img').removeAttr('onmouseover');
                $('#right_scroll img').removeAttr('onmouseout');
                $('#right_scroll img').removeAttr('onmousedown');
                $('#right_scroll img').unbind('click');
                $('#right_scroll img').attr("src", "Images/gray_next_1.png");   

                };
            });  

        //when user clicks the image for sliding left  
        $('#left_scroll img').click(function(){  

            //if at end of carousel and sliding back to left, enable click event for sliding on the right...
            if($('#carousel_ul li:first').attr('id') == fifth_lli){

                $('#right_scroll img').attr("src", "Images/red_next_1.png");
                $('#right_scroll img').bind('click');   // this doesn't work.

            };      
        });  

  });

Rather than mess around binding/unbinding events, why not simply check if the carousel is at the end, and then just do nothing. — Rory McCrossan, Nov 05 '12 at 12:30

score 0 · Answer 1 · answered Nov 05 '12 at 12:40

Instead of unbinding and rebinding just check if the carousel is at the end or beginning before you move it.

$(document).ready(function() {
    $('#right_scroll img').click(function() {
        if ($('#carousel_ul li:first').attr('id') !== fifth_lli) {
            //slide carousel right
        }
    });
    $('#left_scroll img').click(function() {
        if ($('#carousel_ul li:first').attr('id') !== first_lli) { //changed it to first first_lli, i figure that would be the end of the left scrolling
            //slide carousel left
        }
    });
});

Rebind click event

1 Answers1