Sorry for the vague subject line. Let me try to explain:
I built a reusable plugin for slideshows. Client now needs me to add something that will affect its reusability.
The line below is a snippet which is attached to a nav button. Each slideshow has a dot per slide. When clicked I get the number of sibling that it is within the group and then I look UP the DOM to the nearest div with the class called 'slide_holder'. I then display the slide that has the same sibling number as the dot
(In other words - If you click the second dot in the group of dots, then the second slide will fade in. If you click the 3rd dot, then the 3rd slide will fade in)
Below is a snippet (CLICK HANDLER)
- $('.slider_dot').click(function() {
-
- $(this).parent('.slide_dot_holder').prev('.slide_holder').children().fadeOut('slow');
- $(this).parent('.slide_dot_holder').prev('.slide_holder').find('div:eq(' + $(this).index() + ')').fadeIn("slow");
-
- });
My current issue is that I now need to add something that will break the reusability
Since I am within the click handler I can use 'this' to find which div was clicked and then from there I can find relative DIVs by looking up the DOM.
I now have to leave the click handler by sending some variables to a new function like this
This will be added to the click handler and passed to the external function rw_load_slide_content()
- var rw_pass_number = $(this).index()+1;
- rw_load_slide_content(rw_pass_number);
I now need to not only send the value of the sibling (rw_pass_number) but I also need to pass the 'target' which was previously $(this).parent('.slide_dot_holder').prev('.slide_holder').find('div:eq(' + $(this).index() + ')') when within the click handler (see line 4 above).
How can I pass that value?
Here is the next part for reference. My challenge is how NOT to select ALL divs with a class of 'slide_holder' and to remain with THE selection that was understood within the click handler (see line 4 above)
- function rw_load_slide_content(rw_pass_number_passed){
-
- switch (rw_pass_number_passed) {
-
- case 1:
- $('.slide_holder').html('put html here')
-
- break;
-
- case 2:
-
- $('.slide_holder').html('put html here' )
-
- break;
-
- }; //END SWITCH
-
-
- };//END FUNCTION rw_load_slide_content
Thank you for your help!
Rich