Multiple Buttons with the same Click Interaction

[buntestrahlen (Jaro)]

Hey guys!
I want to add multiple buttons to my page. All of the buttons should trigger the same click interaction. The interaction is only affecting different elements on the page, not the button itself. All of the click interactions should have a state for the first and for the second click. Until here everything is good!

Now I want the interaction to work properly, no matter which of the button gets clicked. So if you click on Button 1 at first the first click action gets triggered. If you click on Button 2 afterwards the second click action gets triggered. If you click Button 3 after that the first click action gets triggered. And if you click Button 1 again, the second click action gets triggered.

What happens now is that every Button has its own counter, checking if it got clicked the first or the second time. What I need is one counter for all the buttons together…

Is there anybody who can help me achieve this? I hope you can understand my problem…

Thanks a lot!
Jaro
=)

[bartekkustra (Bartosz Kustra)]

JavaScript is the solution for your problem.

Create a variable that will hold the click number value like var howManyTimesClicked = 1; and each button click you should have a function called that will check the current howManyTimesClicked variable and do proper to it functions.

function doTheButtonThingy(param) {
	switch(param) {
		case 1: 
			// instructions
			howManyTimesClicked++;
			break;
		case 2: 
			// instructions
			howManyTimesClicked++;
		case 3:
			// instructions
			howManyTimesClicked = 1;
		default:
			console.log('something is broken...');
			howManyTimesClicked = 1;
	}
}

$(document).ready(function() {
	var howManyTimesClicked = 1;
	$('.button-class-to-click').click(function(e) {
		e.preventDefault();
		doTheButtonThingy(howManyTimesClicked);
	});
});

I haven’t tested it. Just wrote it from hand.

[buntestrahlen (Jaro)]

hey man!
thank you so much for your answer. so there is no way to implement that directly with webflow, right? i am very new to javascript. i roughly understand what you wrote and what i can achieve with that. but can you help me further on? how can i call an interaction made in webflow manually in a custom javascript snippet? or do i have to copy and paste the function after exporting? i would love to be able to change the interaction anytime in webflow. is there a way to do that?

thank you so much!
jaro!