WordPress.org

1. Cena
   Member
   Posted 8 years ago #

   MtDew...how'd you do it? Will you share the benefits of your superior skillz with the rest of us groveling peons? :)

2. Serge K. Keller, FCD
   Member
   Posted 8 years ago #

   Mmmh... Have you tried this? Works a charm, validates and needs only two javascripts files too. Oh, and it's free!
   Only drawback, if you want/need more or less tabs it will ask for some "heavy-duty" customisation and testing...
   HTH

3. Nick Momrik
   Member
   Posted 8 years ago #

   It's not working in Opera. :-(

4. Nick Momrik
   Member
   Posted 8 years ago #

   I found something new to use, but it has to be tweaked of course. When I have it tested, I'll come up with some instructions and post it.

5. Nick Momrik
   Member
   Posted 8 years ago #

   Wouldn't it be sweet if as a visitor is clicking around on your blog....the same tab stays open until the visitor changes it?
   Well, now it does! The code has been updated to add cookies.

6. NuclearMoose
   Member
   Posted 8 years ago #

   Here's an interesting variation of a CSS/XHTML horizontal nav system:
   SimpleBits
   No javascript required.

7. Nick Momrik
   Member
   Posted 8 years ago #

   But does that allow you to show/hide content or just open a new link?

8. Nick Momrik
   Member
   Posted 8 years ago #

   Now has it's own Wiki page...
   http://wiki.wordpress.org/index.php/Tabbed%20Sidebar

9. OrbitJuice
   Member
   Posted 8 years ago #

   MTV,
   I dunno what changed, but I grabbed the ver. from your site and it worked.
   I re-impleted the ver. from the WikiPage and it no longer works.

10. Nick Momrik
    Member
    Posted 8 years ago #

    I cleaned up a bit of the CSS last night....hmmm. I'll have to take a look at it tonight.

11. OrbitJuice
    Member
    Posted 8 years ago #

    This is the line (in bold) allegedly causing the problem (per IE)
    function clearTop() {
    topRow = document.getElementById('tabs');
    tabArray = topRow.childNodes;
    for (var i=0; i<tabArray.length; i++) {
    tabArray.className = 'tab';
    }
    }

12. Nick Momrik
    Member
    Posted 8 years ago #

    The Wiki is doing something to the code.
    I get it working on my test site, paste the code to the Wiki. I then remove the code from my test site, copy from the Wiki, and paste to the test site....doesn't work. Doesn't make much sense.

13. OrbitJuice
    Member
    Posted 8 years ago #

    Can you put the old link back up on your website that worked?

14. Nick Momrik
    Member
    Posted 8 years ago #

    Wiki code is working now! Took me awhile to figure out what it was doing to the code and how to fix it, but I just tested it out and it's good to go.
    Sorry for the problem. :-/

15. OrbitJuice
    Member
    Posted 8 years ago #

    It's doing something else wierd now.
    the tabs are indented about 15 - 20px.

16. Nick Momrik
    Member
    Posted 8 years ago #

    Have you tried to modify the CSS? I believe I have it centering the tabs.

17. OrbitJuice
    Member
    Posted 8 years ago #

    I removed the centering, and it still has them indented.

18. Nick Momrik
    Member
    Posted 8 years ago #

    Orbit,
    I'm testing it on the default template and when I remove the centering there is only a very small indent (2px padding and 1 px margin) on the LI. Have you checked your other styles to see if they are interfering? Can you give a link to your site?

19. OrbitJuice
    Member
    Posted 8 years ago #

    http://www.orbitjuice.com
    right now, they're not active (the menutabs)
    The only other UL or LI reference in my CSS is defining LI bullets to be square.

20. Nick Momrik
    Member
    Posted 8 years ago #

    Turns out that we had to set a margin:0 for the "tabs" div because of IE problems. It was working fine in Mozilla.
    I've updated the Wiki! :-)

21. Nick Momrik
    Member
    Posted 8 years ago #

    I found a problem with the cookie code that is now fixed. It was saving a cookie for almost every "page" viewed, so in effect it wasn't really saving the tab that you were looking at, it was saving the tab for each page.
    The Tabbed Sidebar instructions have been modified in the Wiki.

22. mudanoman
    Member
    Posted 5 years ago #

    I installed the sidebar tabs, but the first tab does not show until being clicked on. Is there a way to set the default showing tab1 as clicked upon page load...

    Here is the display code.
    <ul id="tabs">
    <li class="tab" id="tab1" onclick="switchOn(1);">Tab 1
    <li class="tab" id="tab2" onclick="switchOn(2);">Tab 2
    <li class="tab" id="tab3" onclick="switchOn(3);">Tab 3

    Change something here?
    <li class="tab" id="tab1" true or auto ???onclick="switchOn(1);">Tab 1

    complete code of sidebar
    http://wiki.wordpress.org/Tabbed%20Sidebar

Topic Closed

This topic has been closed to new replies.