Member Avatar for 54uydf

Hey, I want to add tabs to my php page, but I don't know JS..
I found many ready tabber scripts but I'm having 2 problems- the text on the tab's title is set somewhere in the JS and I can't find it, it makes them Tab 1, Tab 2, Tab 3, and I want to put other words instead..

and another thing is the script made me 3 tabs, I want to add more tabs, when I added the 4th div to the php it didn't change anything..so I must change something in the JS again..don't know where does it says that there's only 3 tabs..

I'm using the script form this site http://www.barelyfitz.com/projects/tabber/

•
•example.html
•example.css


thank you.

  • 1 Contributor
  • 1 Reply
  • 114 Views
  • 12 Hours Discussion Span
  • Latest Post Latest Post by 54uydf

Dani AI

Generated

Short answer: those generic labels appear when the tab library can't find a title for a tab, and extra tabs won’t show if the markup or script timing is wrong. As discovered, the usual fixes are to (a) provide a title for each tab in the HTML you generate and (b) make sure the tab markup exists before the tab script runs.

A minimal, reliable markup pattern is to give each tab element a title attribute and keep them inside the main tab container:

<div class="tabber">
  <div class="tabbertab" title="Overview">
    ...content...
  </div>

  <div class="tabbertab" title="Details">
    ...content...
  </div>

  <div class="tabbertab" title="More">
    ...content...
  </div>
</div>

Troubleshooting checklist:

  • Verify class names exactly (container vs. child classes). A typo means the script won’t detect the tabs.
  • If you generate tabs server-side with PHP, view the page source in the browser to confirm the title attributes are actually present in the delivered HTML.
  • Ensure the tab script runs after the HTML is in the DOM (place the script before </body> or run on DOMContentLoaded). See the DOMContentLoaded note on MDN for details: DOMContentLoaded event.
  • If adding tabs dynamically after initialisation, reinitialise the tab library or rebuild the tab container (many libraries only scan once on load).
  • If you still see default labels, search the library file for the fallback text or inspect with devtools to see what the script found.

For how HTML supplies the visible label, see the HTML title global attribute reference: title (global attribute).

Member Avatar for 54uydf

ok I tried to change it in php and it didn't work and now it does work..don't know what was the deal before..
nevermind.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.