Tabbed Content / Posts /

Change class name

1
Hello, thanks a lot for this great job.
The source code contains some class as follow:

<ul class="tabs">
<div class="tabcontents">
<div id="view1" class="tabcontent">

Unfortunately, those 3 classes (tabs, tabcontents, tabcontent) have been already used in my existing code. How to change those classes name (eg. become xxtabs, xxtabcontents, xxtabcontent) while keeping the javascript works?

Thanks a lot..
Guldan  6 years ago   viewed: 3560    

6 Answers

0
You can surely change the class names. You should also update the CSS selector accordingly in your tabcontent.css file.
milo   6 years ago
0
Hi milo, thanks for the response.
But CSS is only responsible for the layout, not the behavior of the tab/slider. Yes, we can change the class name as long as we update the CSS, and the layout will keep intact.
The original href of the link is "#". If we change the class name, it seems that the javascript no longer controlling the tab.
So when you click the tab title, instead of showing the tab content, it will go to yourdomain.com/# (back to the beginning of the page).
I'm sure it's the javascript part that we have to alter, but I don't know which part..
Guldan
  6 years ago
0
Search the tabcontent.js for: if(b(e[d],"tabs"))
And replace the "tabs" with your new "xxtabs"
milo   6 years ago
0
Hi milo, thanks a lot, it works! :)
And how about the class "tabcontents" and "tabcontent"? I can't find those 2 classes in the tabcontent.js file.
Currently I also change those 2 classes to be "xxtabcontents" and "xxtabcontent" (and alter the CSS part accordingly).
It still works anyway.
Perhaps the tabcontent.js is only dealing with "tabs" class (and don't care with the rest classes)?

Thanks a lot!
Guldan
  6 years ago
0
The tabcontent.js concerns the "tabs" class and the tabcontent.css concerns the class "tabcontents" and "tabcontent".

FYI, the Tab Content will be re-written in May 2013 and this post will not be valid anymore for the new release.
milo   6 years ago
0
Thanks a lot for the clarification. Very useful!
Guldan
  6 years ago

   

Your name*
Password
(Optional. Used to modify this post afterwords)
+ =  

Ask your Own Question

  • If your question is related to the topic of this post, you can post your question to this page by clicking the "Post a reply" button at left;

  • When you want to start a new page for your question: