Hello and welcome to our community! Is this your first visit?
Register
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
    Aug 2010
    Posts
    418
    Thanks
    18
    Thanked 2 Times in 2 Posts

    combine two functions for efficiency

    I've got two huge scripts that are basically duplicates with only minor differences. They run the same exact animations and commands, but one function applies to a set of images, and the second to text navigation. I've been trying to figure out how to combine these into one, but they stop working, or half stops working. Maybe somebody can show me what it would look like if I combine these.

    Basically, I want to combine the two bottom segments.

    Code:
    $('.square-container').on('click', '.square', function(event) {	
        if ( $(this).hasClass('active') ) { /* and so on */
    and

    Code:
      $('.main-nav,.reg3,.privacy_policy,.subnav').on('click', '.main', function(event) {
        if ( $(this).hasClass('aa') ) { /* and so on */

    Here's the idea of what failed attempt:


    Code:
    $('.square-container','.main-nav,.reg3,.privacy_policy,.subnav').on('click', '.square' || '.main', function(event) {	
        if ( $(this).hasClass('active') || $(this).hasClass('aa') ) { /* and so on */
    Here's a stripped down version of my starting point:

    Code:
     $(document).ready(function(){
        
        
        $('.square-container').on('click', '.square', function(event) {	
        
        	if ( $(this).hasClass('active') ) {
        	
        			/* several animations here to return to start */
        			
        			
        		} else if ( $(this).hasClass('one') ) {
        			
        			/* several animations for section 1 */
        			
        			$('.one').addClass("subbed").stop().animate({ width: '227', height: '320', left: '260', top: '26', opacity: 1}, 600, function() {
        			
        			/*load content*/;
        							
        			 });
        			 
        			 /*Position unselected squares*/	
        
        			/*Select active square*/
        			$('.square').removeClass('active');
        			$(this).addClass('active');
        							
        		} else if {  
        				
        			/* several other else if statements to section 2, 3, 4 etc., then finish */
        			
        			
        		}	else {  		
        			alert('nothing');
        		}		
        		
        	});
        
        
        
        /* want to combine the above with below ... */
        
        
        
        $('.main-nav,.reg3,.privacy_policy,.subnav').on('click', '.main', function(event) {
        	
        	
        	if ( $(this).hasClass('aa') ) {
        			
        			/* several animations here to return to start */
        			
        		} else if ( $(this).hasClass('ee') ) {
        		
        			/* several animations for section 1 */
        						
        			$('.one').addClass("subbed").stop().animate({ width: '227', height: '320', left: '260', top: '26', opacity: 1}, 600, function() {
        			
        				/*load content*/;
        				
        			 });
        			 
        			/*Position unselected squares*/	
        					
        			/*Select active square*/
        			$('.square').removeClass('active');
        			$(this).addClass('active');
        				
        		} 
        
        		 else {  		
        			alert('nothing');
        		}		
        		
        	});	
        
        
        
        
        
        
        
        
        };

  • #2
    Regular Coder
    Join Date
    Aug 2010
    Posts
    418
    Thanks
    18
    Thanked 2 Times in 2 Posts

    update...

    I'm trying to solve the problem by making a named function to call. But I'm still running into problems. The function works, while inside the first event handler. But when I move it out, the function runs to the end and alerts "nothing" as if it can't find the classes listed???


  •  

    Posting Permissions

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