Mip-vd-tabs Tab Switch Components

Title	Content
Type	General
Support layout	Responsive,fixed-height,fill,container,fixed
The required script	Https://mipcache.bdstatic.com/static/v1/mip-vd-tabs/mip-vd-tabs.js

Example

Supports 5 styles altogether

Fixed label page

<mip-vd-tabs>

<section>

<li> first Page </li>

<li> second page </li>

<li> Third page </li>

<li> Fourth Page </li>

</section>

<div> content 1</div>

<div> content 2</div>

<div> content 3</div>

<div> content 4</div>

</mip-vd-tabs>

Horizontal Slide Label page

<mip-vd-tabs allow-scroll>

<section>

<li> first season </li>

<li> second quarter </li>

<li> third quarter </li>

<li> fourth quarter </li>

<li> Fifth Quarter </li>

<li> Sixth quarter update to 09</li>

</section>

<div> content 1</div>

<div> content 2</div>

<div> content 3</div>

<div> content 4</div>

<div> content 5</div>

<div> content 6</div>

</mip-vd-tabs>

Horizontal slide tab with Drop-down button

<mip-vd-tabs allow-scroll toggle-more toggle-label= "Custom Text" >

<section>

<li> first season </li>

<li> second quarter </li>

<li> third quarter </li>

<li> fourth quarter update to 09</li>

</section>

<div> content 1</div>

<div> content 2</div>

<div> content 3</div>

<div> content 4</div>

</mip-vd-tabs>

Bottom Label page

<mip-vd-tabs allow-scroll type= "Bottom" current= "3" >

<div> content 1</div>

<div> content 2</div>

<div> content 3</div>

<div> content 4</div>

<section>

<li> first season </li>

<li> second quarter </li>

<li> third quarter </li>

<li> fourth quarter update to 09</li>

</section>

</mip-vd-tabs>

Plot expand tab page

<mip-vd-tabs

Type= "episode"

Toggle-more

Toggle-label= "Old Nine-door plot anthology"

Allow-scroll

Total= "23"

Current= "11"

Text-tpl= "Look at the first {{x}}"

Link-tpl= "Http://www.baidu.com/{{x}}/juji" >

</mip-vd-tabs>

Property

Type

Description: A total of three kinds of special type, bottom (bottom tab), episode (Plot tab), do not fill out the default special type

Required Fields: No

Allow-scroll

Description: Allow sliding

Required Fields: No

Toggle-more

Description: Whether to display the Drop-down button. Predecessors depend on the Allow-scroll property

Required Fields: No

Toggle-label

Description: Dropdown description text. Predecessors depend on the Toggle-more property

Required Fields: No

Current

Description: The Currently selected tab page, starting at 0 count (current= "3" represents page 4th). When Type= "episode", it represents the current episode, counting from 1 (current= "4" for the 4th episode), and the default is 1.

Required Fields: No

Total

Description: Total number of episodes. The predecessor relies on the Type= "episode" And When Type= "episode" is required

Required Fields: No

Page-size

Description: Shows the number of episodes per page. The predecessor relies on the Type= "episode" and Defaults to 50

Required Fields: No

Text-tpl

Description: The episode copy displayed on the label page, "{{x}}" in "{{x}}}" will be replaced with a number representing the set number. The predecessor relies on the Type= "episode".

Required Fields: No

Link-tpl

Description: In the tab and Drop-down menu of the episode jump Link, the link "{{x}}" will be replaced with the number of sets. The predecessor relies on the Type= "episode", When Type= "episode" is required.

Required Fields: No

Head-title

Description: Tabs and drop-down menu episodes jump to the header of the new page. The predecessor relies on the Type= "episode", When Type= "episode" is required.

Required Fields: No