aed
div.post.online.st-answer-admin, div.post.st-answer-admin { background-image: url(http://i39.servimg.com/u/f39/18/22/09/39/admin-10.png)!important; background-position: right bottom; background-repeat: no-repeat; }
Ακτιβιστές
Gamatos (2920)
 
SCZI (1799)
 
Rock'n'Trolla (1690)
 
lOlman (1537)
 
Technical Supporter (1393)
 
Voks (1043)
 
B-Colt (994)
 
rebelos (812)
 
Μurderer (710)
 
YuGo007 (608)
 

Βοήθησε όπως μπορείς
για να παραμένει η Παρέα
στο χώρο αυτό

Περαστικός - 0
Νέος Χρήστης - 20
Μέλος - 50
Κάτοικος - 150
Πρεσβύτερος - 300
Βετεράνος - 500

Μη Συνδεδεμενος Παρακαλώ συνδεθείτε ή εγγραφείτε

Επισκόπηση προηγούμενης Θ.Ενότητας Επισκόπηση επόμενης Θ.Ενότητας Πήγαινε κάτω  Μήνυμα [Σελίδα 1 από 1]

DreaMaker

ΦώτοΝτοσιέΕπαφές


Very Happy Καλησπέρα σας, εάν σας αρέσει αυτό που φαίνεται στην παρακάτω εικόνα τότε κάντε τα εξής:


Templates: ACP => Display => Templates --> General --> index_body και βρείτε τον παρακάτω κώδικα.

Κώδικας:
<div id="stats">

Αφού βρείτε τον παραπάνω κώδικα κάντε αντιγραφή και επικόλληση τον παρακάτω κώδικα αμέσως από κάτω του....

1. Αυτός ο κώδικας εμφανίζει τις καρτέλες
Κώδικας:
<div id="tabs_container">
    <ul id="stabs">
        <li class="active"><a href="#tab1">Tab 1</a></li>
        <li><a href="#tab2">Tab 2</a></li>
        <li><a href="#tab3">Tab 3</a></li>
    </ul>
</div>

2.Ενώ, αυτός ενεργοποιεί τις καρτέλες.
Κώδικας:
<div id="tabs_content_container">
    <div id="tab1" class="tab_content" style="display: block;">
        <p>Content for the First tabs goes here</p>
    </div>
    <div id="tab2" class="tab_content">
        <p>Content for the Second tabs goes here</p>
    </div>
    <div id="tab3" class="tab_content">
        <p>Content for the Third tabs goes here</p>
    </div>
</div>

CSS:
Κώδικας:
#tabs_container {
    border-bottom: 1px solid #ccc;
}
#stabs {
    list-style: none;
    padding: 5px 0 4px 0;
    margin: 0 0 0 10px;
    font-family: Verdana,Arial,Helvetica,sans-serif;
    font-size: 13px;
}
#stabs li {
    display: inline;
}
#stabs li a {
    border: 1px solid #ccc;
    padding: 4px 6px;
    text-decoration: none;
    background-color: #eeeeee;
    border-bottom: none;
    outline: none;
    border-radius: 5px 5px 0 0;
    -moz-border-radius: 5px 5px 0 0;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
}
#stabs li a:hover {
    background-color: #dddddd;
    padding: 4px 6px;
}
#stabs li.active a {
    border-bottom: 1px solid #fff;
    background-color: #fff;
    padding: 4px 6px 5px 6px;
    border-bottom: none;
}
#stabs li.active a:hover {
    background-color: #eeeeee;
    padding: 4px 6px 5px 6px;
    border-bottom: none;
}
 
#tabs_content_container {
    border: 1px solid #ccc;
    border-top: none;
    padding: 10px;
}
.tab_content {
    display: none;
}

Πηγαίνετε στο Admin Control Panel και επιλέγετε το Modules => HTML & JAVASCRIPT => Javascript codes management Create a new javascript ---> In all the pages.
JAVASCRIPT
Κώδικας:
$(document).ready(function(){
    //  When user clicks on tab, this code will be executed
    $("#stabs li").click(function() {
        //  First remove class "active" from currently active tab
        $("#stabs li").removeClass('active');
 
        //  Now add class "active" to the selected/clicked tab
        $(this).addClass("active");
 
        //  Hide all tab content
        $(".tab_content").hide();
 
        //  Here we get the href value of the selected tab
        var selected_tab = $(this).find("a").attr("href");
 
        //  Show the selected tab content
        $(selected_tab).fadeIn();
 
        //  At the end, we add return false so that the click on the link is not executed
        return false;
    });
});

Αυτό ήτανε όλο. Ελπίζω να σας άρεσε..

Επισκόπηση προηγούμενης Θ.Ενότητας Επισκόπηση επόμενης Θ.Ενότητας Επιστροφή στην κορυφή  Μήνυμα [Σελίδα 1 από 1]



Δικαιώματα σας στην κατηγορία αυτή
Δεν μπορείτε να απαντήσετε στα Θέματα αυτής της Δ.Συζήτησης