The script below does achieve the task of changing image src with corresponding page content #ID however, I would like to optimize the script to increase functionality and loading speeding. Can any javascript / jQuery developer(s) suggest alternative script(s) with explanation?

Code:
 
$('#about').waypoint(function(event, direction){
    if (direction ==='down'){

    $('#myLogo').attr('src','./images/logo3.png');
    }else{
        direction ==='up';
     $('#myLogo').attr('src','./images/logo2.png');
    }
});

$('#portfolio').waypoint(function(event, direction){
    if (direction === 'down'){

    $('#myLogo').attr('src','./images/logo4.png');
    }else{
        direction === 'up';
    $('#myLogo').attr('src','./images/logo3.png');
    }
});

 $('#skills').waypoint(function(event, direction){
    if (direction === 'down'){

    $('#myLogo').attr('src','./images/logo5.png');
    }else{
        direction === 'up';
    $('#myLogo').attr('src','./images/logo4.png');
    }
});

$('#myclients').waypoint(function(event, direction){
    if (direction === 'down'){

    $('#myLogo').attr('src','./images/logo6.png');
    }else{
        direction === 'up';
    $('#myLogo').attr('src','./images/logo5.png');
    }
});
    $('#contact').waypoint(function(event, direction){
    if (direction === 'down'){

    $('#myLogo').attr('src','./images/logo7.png');
    }else{
        direction === 'up';
    $('#myLogo').attr('src','./images/logo6.png');
    }
});