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  11 years ago   viewed: 4923    

7 Answers

0
You can surely change the class names. You should also update the CSS selector accordingly in your tabcontent.css file.
milo   11 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
  11 years ago
0
Search the tabcontent.js for: if(b(e[d],"tabs"))
And replace the "tabs" with your new "xxtabs"
milo   11 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
  11 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   11 years ago
0
Thanks a lot for the clarification. Very useful!
Guldan
  11 years ago
0

By following these steps, you can effectively change the class names in your slope game HTML and JavaScript without breaking functionality. 

Aileen Lowe
  one month 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:
▲