function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Jason Post 2Jason Post 2 

How to code 'scoped tabs' in Lightning Design system?

I want to use the 'scoped tabs' component in a demo community on the Napili template. Example of 'scoped tabs' from LDS (Lightning Design System) at https://www.lightningdesignsystem.com/components/tabs/#scoped 

I will be hand-coding the markup. The HTML markup seems easy enought. But I see in the description on the web page, it has some 'javascript needs' to move the .slds-active class and toggle the .slds-hide/.slds-show classes.

Does that mean it requires me to write custom javascript? 

User-added image
Vernon KeenanVernon Keenan
Yes, you need  to manage your own Javascript events in hand-coded SLDS. As you noted, the docs say what you need but don't tell you how to do it. Check here for a jQuery example:

http://www.fabientaillon.com/using-tabs-component-with-salesforce-lightning-design-system/