Change price depending on clicked dropdown option

Design help Animations & Interactions
1

Hi!

Short said I want to change the price text on all 3 plans depending on which option I choose in the dropdown menu. I haven’t found anyone doing this, is this possible? All help is welcome!

Read only link: https://preview.webflow.com/preview/daniels-pricing-table-lig-688ab86b91c6b?utm_medium=preview_link&utm_source=designer&utm_content=daniels-pricing-table-lig-688ab86b91c6b&preview=5f83c19abe536d82dec5cedbd2848f61&workflow=preview

2

Hey @FredrikGehrke

My suggestion is to use Interactions to hide/show the different prices based on what’s chosen in the dropdown menu. Here’s a link to our course on Interactions in case you’re not familiar with the feature.

3

Hi, yes i’ve been testing that out. My problem with that is that there is going to be sooo many combinations… like first choose between about 10 dropdown menu items. And then I want a sliderbutton from 1-10 which also will increase/decrease the price… any idea about that second part on how to get that in?

4

That second part would require writing custom code. This series from Finsweet might help get you started. https://www.youtube.com/playlist?list=PLpjTM82q4Gu4KKw_KRgXpdQdQL9t8UnIh

5

Not so comfortable with the custom code part but I’ll try.
Another question: I have a dropdown menu and when I click it I want the text displayed in the dropdown to change. Right now it’s just a text. Is there an easy way to do this or do I also have to use Hide/Show there?

6

So using interactions to hide/show text is still probably the easiest way to achieve that effect without using custom code.