Single post in A Somewhat Extensive Guide to BBCodes
Forum Index > PokéFarm > Guides > A Somewhat Extensive Guide to BBCodes >
Put the two images you want to alternate between in the same li. Then write a stlye that will do the following to tabs:
- When inactive, show the first and don't display the 2nd
- When active, don't display the first and show the 2nd
You'll see the shiny of each eeveelution as the tab goes active.
Content 1
Content 2
Content 3
Content 4
Content 5
code
[sc=tabbed_interface horizontal]
[ul]
[li]
[img]/img/pkmn/6/y/e.png[/img]
[img]/img/pkmn/n/p/x.png[/img]
[/li]
[li]
[img]/img/pkmn/5/c/2.png[/img]
[img]/img/pkmn/e/4/s.png[/img]
[/li]
[li]
[img]/img/pkmn/p/6/g.png[/img]
[img]/img/pkmn/l/y/9.png[/img]
[/li]
[li]
[img]/img/pkmn/7/5/n.png[/img]
[img]/img/pkmn/m/6/k.png[/img]
[/li]
[li]
[img]/img/pkmn/o/d/t.png[/img]
[img]/img/pkmn/o/o/g.png[/img]
[/li]
[/ul][
][sc=tab]Content 1[/sc][
][sc=tab]Content 2[/sc][
][sc=tab]Content 3[/sc][
][sc=tab]Content 4[/sc][
][sc=tab]Content 5[/sc][
][/sc]
[style]
.tabbed_interface {
&>ul>li {
img:nth-child(2) {
display: none;
}
}
&>ul>li.tab-active {
img {
display: none;
}
img:nth-of-type(2) {
display: inline-block;
}
}
}
[/style]
Avatar by Kaelwolfur.
Sent from my PokéNav