Ya solucione el error que tenia y minimicé el código, ahora cuando quiero aplicar dicho efecto, no me lo aplica, en la consola no me muestra error, pero si hago el evento listener a la dicha variable que verán a continuacion, me lo aplica automaticamente, porque puede ser?

javascript
class Design{
    transitionUp(up, down){
       this.up = up;
       this.down = down;
       this.up.style.transform = "translateY(-1000%)";
       this.down.style.transform = "translateY(0%)";
    }
    transitionDown(up,down){
        this.up = up;
        this.down = down;
        this.up.style.transform = "translateY(0%)";
        this.down.style.transform ="translateY(-1000%)";
        this.down.style.transition="all 3s";
        this.up.style.transition="all 1.3s"; 
    }
}

let diseño = new Design();
let enlance = document.getElementById('sign');
let enlance2 = document.getElementById('sign2');
let loguin = document.getElementById('loguin');
let registro = document.getElementById('registro');
enlance.addEventListener('click', diseño.transitionUp(loguin,registro));
enlance2.addEventListener('click', diseño.transitionDown(loguin,registro));

Ya solucione el error que tenia y minimicé el código, ahora cuando quiero aplicar dicho efecto, no me lo aplica, en la consola no me muestra error, pero si hago el evento listener a la dicha variable que verán a continuacion, me lo aplica automaticamente, porque puede ser?

javascript
class Design{
    transitionUp(up, down){
       this.up = up;
       this.down = down;
       this.up.style.transform = "translateY(-1000%)";
       this.down.style.transform = "translateY(0%)";
    }
    transitionDown(up,down){
        this.up = up;
        this.down = down;
        this.up.style.transform = "translateY(0%)";
        this.down.style.transform ="translateY(-1000%)";
        this.down.style.transition="all 3s";
        this.up.style.transition="all 1.3s"; 
    }
}

let diseño = new Design();
let enlance = document.getElementById('sign');
let enlance2 = document.getElementById('sign2');
let loguin = document.getElementById('loguin');
let registro = document.getElementById('registro');
enlance.addEventListener('click', diseño.transitionUp(loguin,registro));
enlance2.addEventListener('click', diseño.transitionDown(loguin,registro));

Ya solucione el error que tenia y minimicé el código, ahora cuando quiero aplicar dicho efecto, no me lo aplica, en la consola no me muestra error, pero si hago el evento listener a la dicha variable que verán a continuacion, me lo aplica automaticamente, porque puede ser?

javascript
class Design{
    transitionUp(up, down){
       this.up = up;
       this.down = down;
       this.up.style.transform = "translateY(-1000%)";
       this.down.style.transform = "translateY(0%)";
    }
    transitionDown(up,down){
        this.up = up;
        this.down = down;
        this.up.style.transform = "translateY(0%)";
        this.down.style.transform ="translateY(-1000%)";
        this.down.style.transition="all 3s";
        this.up.style.transition="all 1.3s"; 
    }
}

let diseño = new Design();
let enlance = document.getElementById('sign');
let enlance2 = document.getElementById('sign2');
let loguin = document.getElementById('loguin');
let registro = document.getElementById('registro');
enlance.addEventListener('click', diseño.transitionUp(loguin,registro));
enlance2.addEventListener('click', diseño.transitionDown(loguin,registro));