Shulou(Shulou.com)06/01 Report--

This article mainly shows you "JS how to achieve tab switching effect", the content is easy to understand, clear, hope to help you solve doubts, the following let the editor lead you to study and learn "JS how to achieve tab switching effect" this article.

Related codes:

Select tab toggle-(yisu.com) * {margin:0; padding:0;} div.box {width:50vw;/*vw and vh are the height and width of the visualization window, 50vw is 50% of the width of the visualization window / height:50vh;/*50vh is 50% height of the visualization window / display:flex / * make ul and div in the same horizontal column * / margin:20vh auto;} ul.mark {width:10vw; height:50vh; list-style:none;/* remove the black spots in front of li * / text-align:center;} ul.mark > li {border:1px solid black; padding:1vh 0; cursor:pointer;/* change cursor * /} div.main {width:40vw; height:50vh } .main1, .main2, .main3, .main4,. Main5 {width:100%; height:100%; display:none;} img {width:100%; height:100%;} li.checked {background:#F5D2B4;} div.checked {display:block / * elements are displayed in blocks * /} member courtesy vue.js course uni-app introductory course uni-app Cross-platform data Visualization

$("ul.mark li") .click (function () {$("ul.mark li") .removeClass ("checked"); / clear li style $(this) .addClass ("checked"); $(".main > div") .css ("display", "none"); var index = $("ul.mark li") .index (this) / / get the index of li $(".main > div") .eq (index) .css ("display", "block"); / / determine the corresponding content} through the index). This is all the content of the article "how to achieve tab switching effect in JS". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.