In today’s tutorial I am going to show you how to style your vertical navigation links so that as a visitor scrolls down the page, the menu link corresponding to the section they’re in will highlight. It’s a nice little effect that adds a bit of interactivity between your web design and the user’s behaviour.
First, you need to add the below code to <head> section of the integration tab
<script type="text/javascript">
(function($){
$(document).ready(function() {
$('#top-menu li.current-menu-item').first().addClass('current-item');
$('#top-menu li').removeClass('current-menu-item');
$('#top-menu li a').click(function() {
$('#top-menu li').removeClass('current-item');
$(this).parent().addClass('current-item');
});
});
})(jQuery);
</script>
Then add this to the custom CSS section of theme options
#top-menu-nav #top-menu li.current-item a { color: #YourPreferedLinkColorHere !important; }
This should give you the desired result.
Feel free to comment below for any questions.
#top-menu-nav #top-menu li.current-item a { color: #YourPreferedLinkColorHere !important; }If you like the video don’t forget to:
👍 Give It A Thumbs Up
🎯 Hit The Subscribe Button
👉 Don’t Forget To Share
📌 Subscribe: https://www.youtube.com/foysalahmedwe…
📌 Follow me on Facebook: https://web.facebook.com/foysalWordPr…
📌 Follow me Linkedin: https://www.linkedin.com/in/foysal-ah…
📌 Follow me Twitter: https://twitter.com/foysalwordpress
📌 Visit my website: https://www.ecommercethesis.com
📌 Visit my blog: https://foysalahmedwebdesigner.blogsp…
📌 Google My Business: https://foysalahmed.business.site/
📌 Ask me quora: https://www.quora.com/profile/Foysal-…
💻 My Services: 🚀
🔸 WordPress live support instantly
👉 https://www.fiverr.com/share/e8m9xk
🔸 Professional eye-catching website design with elementor pro page builder on WordPress
👉 https://www.fiverr.com/share/q5bX39
🔸 eCommerce Business website design with WooCommerce, Shopify
👉 https://www.fiverr.com/share/8yx7EZ
🔸 Design a WordPress website with Divi elegant theme
👉 https://www.fiverr.com/share/3eAQgA
🔸 Convert PSD to WordPress
👉 https://www.fiverr.com/share/NWeAyy
🔸 WordPress SEO with Yoast and On-Page Optimization
👉 https://www.fiverr.com/share/oWdrkg
🔸 Design SEO friendly website from scratch
👉 https://www.fiverr.com/share/6z1G6A
🎤🎤 You can also check out the below playlist: 👇
🛑 HTML Bangla Tutorial: https://bit.ly/2XTNOq4
🛑 CSS Bangla Tutorial: https://bit.ly/3amALAh
🛑 Elementor Page Builder Tutorial: https://bit.ly/2Kj7oUT
🛑 Digital Marketplace using Mayosis Theme: https://bit.ly/3eFelxq
🛑 ওয়ার্ডপ্রেস থিম কাস্টমাইজেশন : https://youtu.be/Tw0J_D7Ahz0
🛑 ফটোশপ বাংলা টিউটোরিয়াল : https://bit.ly/2zlXnEh
🛑 Make Money on YouTube 2020: https://bit.ly/3gYE9Vn
🛑 Shopify Tutorial: https://bit.ly/32LVD21
🛑 ওয়ার্ডপ্রেস থিম ডেভেলপমেন্ট : https://bit.ly/34X76P6
🛑 ই কমার্স বিজনেস / ব্যবসা বাংলাদেশ : https://bit.ly/32Rw8MV
➡️ Disclaimer:
This Channel Does Not Promote Any illegal content, all contents provided by This Channel is meant for educational purpose only. Don’t Download Or Copy Video, Thumbnail, Music, Nothing From This Channel. It’s a Cyber Crime. All Videos of this Channel are Copyrighted by Foysal Ahmed!
Thank You 🙃🙃