Inspired by an interesting requirement posted in the Avada forum
The menu items above will scroll to a set of tabs further below and open the selected tab. Kinda like a remote control accordion. Give it a try by cliking on one or all of the Tab links above.
Each tab contains tips and tricks to make this work in Avada.
Hashtag eu roof party magna heirloom craft beer, aesthetic tacos direct trade hoodie in et beard. Snackwave ennui YOLO beard ethical tattooed. Retro laborum food truck photo booth. Hella shabby chic coloring book glossier tempor tbh pork belly succulents taxidermy mixtape fingerstache raclette anim austin. Intelligentsia ennui tousled, mustache taxidermy raclette jianbing distillery. Butcher la croix incididunt exercitation veniam.
Adaptogen pabst incididunt, flexitarian ut veniam pop-up selfies everyday carry ennui lo-fi keytar est gluten-free celiac. Meggings la croix food truck culpa pop-up austin succulents wolf. Hella succulents kitsch taiyaki. Hot chicken sriracha disrupt paleo irony keytar scenester cupidatat activated charcoal gluten-free pok pok vegan. Live-edge intelligentsia reprehenderit bespoke, church-key eu meggings duis. Mlkshk locavore ut dolor.
Meditation deserunt bespoke, typewriter ennui 3 wolf moon venmo migas austin aliqua. Lorem cloud bread succulents seitan ea est commodo af bitters. Wolf hot chicken laboris waistcoat umami. You probably haven't heard of them before they sold out fixie selfies pariatur synth tumeric migas raw denim. Sartorial mustache literally, freegan cliche iceland pop-up raclette biodiesel sriracha portland. Flannel ethical edison bulb, cardigan normcore unicorn portland kinfolk enim cronut williamsburg. Cillum master cleanse forage eiusmod, fingerstache sint put a bird on it tousled literally.
Notice that I'm not hidden when you get to me from clicking my link in the menu. Yes, the sticky header above is respected in this demo.
Scroll back to the top and click on Tab 2 to see this in action again.
Consequat trust fund narwhal beard gochujang neutra id, sint pabst taxidermy pitchfork. Tempor ipsum bicycle rights, ut artisan poutine viral small batch slow-carb kitsch freegan cred dreamcatcher direct trade id. Celiac VHS mustache squid schlitz. Lomo vape aliquip intelligentsia. La croix four loko keffiyeh deep v fashion axe laborum retro gluten-free pickled 3 wolf moon mumblecore quis ex. Kinfolk poke sed, portland cred succulents shaman wayfarers laboris tbh before they sold out live-edge.
If you want to make this work in your Avada site, you can try the following:
- Copy/paste this HTML as a template into a Fusion Builder code element.
- Remove the body and header sections.
- Change the tab headings and body contents to what you want.
- Add or remove spans (tab headings) and divs (tab contents) as needed.
- Copy/paste the CSS into your page's CSS setting. Keep the very first rule and all the tab related rules. Remove what's not needed e.g., body and to top classes.
- Click on Tab 3 for the JavaScript part.
Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean. A small river named Duden flows by their place and supplies it with the necessary regelialia. It is a paradisematic country, in which roasted parts of sentences fly into your mouth. Even the all-powerful Pointing has no control about the blind texts it is an almost unorthographic life One day however a small line of blind text by the name of Lorem Ipsum decided to
For the JavaScript, you can try the following:
- Copy/paste the JavaScript into the Avada > Theme Options > Advanced > Code Fields > Space before