Hello!
How can I make (with interactions) so that when I click on one of the buttons, the background changes to red and from the other radio button the red background is removed (toggle)? I tried using all the values from the advanced panel one by one, but I couldn’t find anything suitable.
You could use a click trigger in Interactions but that would also change the color then you click twice on a radio toggle without changing it’s value.
I would do this with Javascript (if(toggle.checked == true))
1 Like
Hi @Riccarcharias , thank you
More specifically, I was trying to implement something like this from the video. Does it come out that I can’t implement this with interactions completely without resorting to writing javascript?
I used some checkboxes for a project today in Bootstrap. This was a radio button group. Its much easier with a frame work, then you just use CSS.
1 Like
I don’t think that you can achieve this in Pinegrow Interactions. But maybe you don’t need Javascript, maybe you can do this with CSS alone.
Try input[type=radio]:checked as a CSS selector with which you can style how the checked version of your radio button should look like. use “transition: 0.5s” for the smooth change effect.
1 Like
@creer If I understand correctly what you’re looking for (but maybe I’m wrong), this type of behavior doesn’t require heavy artillery and can probably be created using just CSS, like in the example I show in this video.
4 Likes
@Emmanuel @Riccarcharias, thank you very much, the CSS method suits me 100%. I agree that in my case, it is possible to manage with just CSS. I just wanted to make sure if it’s possible to implement my idea entirely visually using interactions - because using toggle mechanics it’s possible to realize many different animations
1 Like
You can’t do this with Pinegrow Interactions because there ist no trigger for “is active” or “is checked”
1 Like