• When posting, please be aware that artistic nudity is still nudity and not allowed under RpNation rules. Please edit your pictures accordingly!

    Remember to credit artists when using work not your own.

Help help with tabs

bixby

gucci jetski
hello so i have this code that i worked really hard on but i don't really understand class and scripts and stuff so i messed something up and cant fix it. when you click on tab 2 and tab 3, the contents don't show. can anyone fix this?




quote or something idk



[class=tabs] background-color: rgba(255,255,255,0); border-radius: 1px; box-sizing: border-box; color: white; font-size: 15px; font-weight: bold; line-height: 1; margin: 20px auto; min-width: 350px; text-align: center; width: 500px; position:relative; top:-65px; [/class] [class=tab] box-sizing: border-box; cursor: pointer; display: inline-block; padding: 5px 0; width: 33%; [/class] [class name=activeTab] background-color: rgba(211,211,211,0.5); letter-spacing:3px; [/class] [class name=tab state=hover] background-color: rgba(211,211,211,0.5); letter-spacing:3px; [/class] [script class=tab on=click] hide tabsContent removeClass activeTab tab addClass activeTab set currentTab (getText) if (eq ${currentTab} tab1) (show tabsContenttab1) if (eq ${currentTab} tab2) (show tabsContenttab2) if (eq ${currentTab} tab3) (show tabsContenttab3) [/script] [div class=tabs][div class="tab activeTab" style="border-top-left-radius: 1px; border-bottom-left-radius: 1px;"]tab1[/div][div class=tab]tab2[/div][div class=tab style="border-top-right-radius: 1px; border-bottom-right-radius: 1px; width: 34%;"]tab3[/div][/div] [div class="tabsContent tabsContenttab1"]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec dictum turpis urna, eget volutpat dolor suscipit at. Nam in euismod augue. Aliquam erat volutpat. Integer vel neque dapibus, vehicula eros quis, viverra ex. Integer in convallis enim. Nunc at porta tortor. Phasellus elementum porttitor nisi eget faucibus. Donec eleifend nec erat in vulputate. Donec et ligula cursus ligula auctor hendrerit vel nec leo. Pellentesque venenatis, mauris aliquam accumsan interdum, libero enim iaculis est, quis dignissim nisi lectus vitae felis. Aliquam erat volutpat. Nam pellentesque mi at auctor pretium. Phasellus quis nisi sem. Vestibulum ac accumsan nibh, eget mattis lorem. Aenean erat elit, feugiat eget accumsan placerat, ullamcorper ut mauris. Suspendisse nec neque at augue porttitor convallis at quis tortor. Sed laoreet pellentesque egestas. In tincidunt leo neque, eu venenatis ligula vestibulum sed. Curabitur vitae accumsan purus.
.
[div class="tabsContent tabsContenttab2" style="display: none;"]tab 1 contents[/div] [div class="tabsContent tabsContenttab3" style="display: none;"]tab 2 contents[/div][/div]

Code:
          [div=background-color:rgba(255,255,255,0.5);
          width:100%;
          height:20px;
          position:relative;
          top:5px;]
               [div=color:white;
               text-align:center;
               position:relative;
               top:-50px;
               font-style:italic;
               opacity:0.8;
               font-size:18px;]
               [font=Raleway]quote or something idk[/font]
               [/div]
     [/div]
[/div]
[nobr]
    [class=tabs]
        background-color: rgba(255,255,255,0);
        border-radius: 1px;
        box-sizing: border-box;
        color: white;
        font-size: 15px;
        font-weight: bold;
        line-height: 1;
        margin: 20px auto;
        min-width: 350px;
        text-align: center;
        width: 500px;
        position:relative;
        top:-65px;
    [/class]
   
    [class=tab]
        box-sizing: border-box;
        cursor: pointer;
        display: inline-block;
        padding: 5px 0;
        width: 33%;
    [/class]
   
    [class name=activeTab]
        background-color: rgba(211,211,211,0.5);
letter-spacing:3px;
    [/class]
    [class name=tab state=hover]
        background-color: rgba(211,211,211,0.5);
letter-spacing:3px;
    [/class]

    [script class=tab on=click]
        hide tabsContent
        removeClass activeTab tab
        addClass activeTab
        set currentTab (getText)
        if (eq ${currentTab} tab1) (show tabsContenttab1)
        if (eq ${currentTab} tab2) (show tabsContenttab2)
        if (eq ${currentTab} tab3) (show tabsContenttab3)
    [/script]
   
    [div class=tabs][div class="tab activeTab" style="border-top-left-radius: 1px; border-bottom-left-radius: 1px;"]tab1[/div][div class=tab]tab2[/div][div class=tab style="border-top-right-radius: 1px; border-bottom-right-radius: 1px; width: 34%;"]tab3[/div][/div]
   
    [div class="tabsContent tabsContenttab1"][div=width:500px;height:300px;overflow:auto;background:url('https://78.media.tumblr.com/e44faa9d1f7a2f41de43f331d4af7db7/tumblr_os53axA9TA1ud8nkjo1_500.png');position:relative;margin:auto;top:-75px;box-shadow: 3px 2px 3px 1px gray;][div=width:50%;
background: rgba(255,255,255,0.7);position:absolute;
top:20px;
left:20px;color:#996D73;text-align:center;font-size:12px;][font=Raleway]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec dictum turpis urna, eget volutpat dolor suscipit at. Nam in euismod augue. Aliquam erat volutpat. Integer vel neque dapibus, vehicula eros quis, viverra ex. Integer in convallis enim. Nunc at porta tortor. Phasellus elementum porttitor nisi eget faucibus. Donec eleifend nec erat in vulputate.

Donec et ligula cursus ligula auctor hendrerit vel nec leo. Pellentesque venenatis, mauris aliquam accumsan interdum, libero enim iaculis est, quis dignissim nisi lectus vitae felis. Aliquam erat volutpat. Nam pellentesque mi at auctor pretium. Phasellus quis nisi sem. Vestibulum ac accumsan nibh, eget mattis lorem. Aenean erat elit, feugiat eget accumsan placerat, ullamcorper ut mauris. Suspendisse nec neque at augue porttitor convallis at quis tortor. Sed laoreet pellentesque egestas. In tincidunt leo neque, eu venenatis ligula vestibulum sed. Curabitur vitae accumsan purus.[/font][/div][div=height:220px;width:190px;position:relative;left:280px;top:20px;background-color:white;][div=background:url('https://i.imgur.com/rre1WXi.jpg');position:relative;margin:auto;width:160px;height:160px;background-size:100%;top:15px;][/div]
[/div][div=opacity:0].[/div]
[div=height:220px;width:190px;position:relative;left:280px;top:10px;background-color:white;][div=background:url('https://i.imgur.com/6ebiCdz.jpg');position:relative;margin:auto;width:160px;height:160px;background-size:100%;top:15px;][/div][/div]
[/div]
    [div class="tabsContent tabsContenttab2" style="display: none;"]tab 1 contents[/div]
   
    [div class="tabsContent tabsContenttab3" style="display: none;"]tab 2 contents[/div][/div]
[/nobr]]
 

Users who are viewing this thread

Back
Top