WaysOn Bank
WaysOn Home
WaysOn Invest
WaysOn Bank
Wherever you are in life, we’ve got an online bank account designed to make it more rewarding. Whichever online bank account you choose, we keep the terms simple, the rewards high and the service stellar. Whichever online bank account you choose, we keep the terms simple, the rewards high and the service stellar.
WaysOn Home
Wherever you are in life, we've designed WaysOn Home to be your virtual gateway to financial empowerment. Just like our WaysOn Bank accounts, we've crafted an online financial hub that simplifies and enhances your financial journey, all from the comfort of your home.
WaysOn Invest
At WaysOn, we understand that achieving your financial goals often involves more than just traditional banking. That's where WaysOn Invest comes into play. We've created a platform that empowers you to take control of your investments, whether you're a seasoned investor or just starting your investment journey.
Instructions to Use
  • You can easily replace with your Contents and change classes based on your project but please note
  • To create the effect where the Tabs Change colour, it is done with a short JS Code in the before body tag', kindly replace the classes accordingly based on the classes you rename your divs and element.
  • I advice you dont change the text of the (.active) class
  • Thank you and Goodluck, if you have any questions , feel free to send me a message on Twitter
  • Access the JS Code below
    <script>
    
    window.onload = function() {
        let elements = document.querySelectorAll('.growth-content_title');
    
        elements.forEach(element => {
            element.addEventListener('click', function() {
                // Remove 'active' class from all elements
                elements.forEach(el => {
                    el.classList.remove('active');
                    let headingText = el.querySelector('.growth_heading-text');
                    let titleArrow = el.querySelector('.growth-content_title-arrow');
                    headingText.classList.remove('active');
                    titleArrow.classList.remove('active');
                });
    
                // Add 'active' class to clicked element
                this.classList.add('active');
                let headingText = this.querySelector('.growth_heading-text');
                let titleArrow = this.querySelector('.growth-content_title-arrow');
                headingText.classList.add('active');
                titleArrow.classList.add('active');
            });
        });
    };
    
    </script>