Slide Animation Issue

I have 2 buttons on a page. I’m trying to make it so one button slides everything right and one slides everything left while showing/hiding a repeater and title text. Everything is working expect even when I specify different directions I still get the same behavior. One toggle (currenteventsbutton) always slides right and the other (pasteventsbutton) always slides left. I’m at a loss.

export function pasteventsbutton_click(event) {
let slideOptionsR = {
“duration”: 1000,
“delay”: 100,
“direction”: “right”
};
$w(‘#currenteventstitle’).hide(“slide”,slideOptionsR);
$w(‘#currentevents’).hide(“slide”,slideOptionsR);
$w(‘#pasteventstitle’).show(“slide”,slideOptionsR);
$w(‘#pastevents’).show(“slide”,slideOptionsR);
}

export function currenteventsbutton_click(event) {
let slideOptionsL = {
“duration”: 1000,
“delay”: 100,
“direction”: “left”
};
$w(‘#pasteventstitle’).hide(“slide”,slideOptionsL);
$w(‘#pastevents’).hide(“slide”,slideOptionsL);
$w(‘#currenteventstitle’).show(“slide”,slideOptionsL);
$w(‘#currentevents’).show(“slide”,slideOptionsL);
}

Fyi figured this out with the following code. Still not 1005 sure why I had to reverse the directions but in any event it’s working as expected now.

let slideOptionsR = {
“duration”: 1000,
“delay”: 100,
“direction”: “right”
};
let slideOptionsL = {
“duration”: 1000,
“delay”: 100,
“direction”: “left”
};
export function pasteventsbutton_click(event) {
$w(‘#currenteventstitle’).hide(“slide”,slideOptionsR);
$w(‘#currentevents’).hide(“slide”,slideOptionsR);
$w(‘#pasteventstitle’).show(“slide”,slideOptionsL);
$w(‘#pastevents’).show(“slide”,slideOptionsL);
}
export function currenteventsbutton_click(event) {
$w(‘#pasteventstitle’).hide(“slide”,slideOptionsL);
$w(‘#pastevents’).hide(“slide”,slideOptionsL);
$w(‘#currenteventstitle’).show(“slide”,slideOptionsR);
$w(‘#currentevents’).show(“slide”,slideOptionsR);
}