Morning all, 

I'm creating a construction query website. And on the home page I want a drop down menu that contains all the trade category's but while it's inactive ( not clicked) I want it to constantly vertical carousel through all the different trades as a previous for what you can pick.

Does anybody have any idea where to start. Doing a Google search I didn't really find any examples of one.

I'm assuming this could be done with JavaScript and CSS. A plugin would be fine though.

If I could create a tombola effect it would be awesome.

 

Kind regards

 

Tom 

 

 

 

 

Hey, Tom

If you're dead set on doing it like that, then you could probably adapt this to suit your needs: https://codepen.io/Tenderfeel/pen/oPgqBv

FWIW separating the animation from the dropdown might work better for UX. A text cycling component below the dropdown could be:

Find a trade: [ Plumber ↕ ]
This would cycle through Electrician, Builder, Roofer, etc.

The dropdown menu itself stays static and usable, while the animation acts as a visual teaser nearby. Seems far more accessible 🪙🪙

You can find anything because this sort of thing doesn't exist. And that's for a very good reason: the UX/UI would be really bad.

A far better and more usable solution is to not even have a menu dropdown. Put all the trades on the page as buttons. Most visitors will be using their phone and buttons work much better than trying to negotiate a menu bar.

If you really want a dropdown (with umpteen trades) expect a very poor response rate. 

I'm struggling to see how this would be useful to anyone. If I visit a similar site looking for a specific trade I'd either use the search or look for a link that signposts to where I want to be.

It sounds more like a gimmick rather than something practical that helps people complete their task(s).