Précédent   Forum des professionnels en informatique > Webmasters - Développement Web > JavaScript > Bibliothèques & Frameworks > jQuery
jQuery Forum d'entraide sur le framework jQuery. Avant de poster : Tutoriels jQuery, FAQ jQuery, Tous les tutoriels JavaScript, Toutes les FAQ JavaScript
Partagez cette discussion sur d'autres réseaux sociaux : Viadeo Twitter Google Facebook Digg Delicious MySpace Yahoo
Réponse Proposer ce sujet en actualité
 
Outils de la discussion
Publicité
'
Vieux 06/10/2011, 17h52   #1
Invité de passage
 
Inscription : mars 2008
Messages : 38
Détails du profil
Informations forums :
Inscription : mars 2008
Messages : 38
Points : 2
Points : 2
Par défaut tabs jquery onglet actif

Bonjour,

J'ai installé des tabs jquery sur mon site web et je n'arrive pas à laisser le premier onglet actif (je veux dire par là le premier onglet apparent quand j'arrive sur mon site).

Je suis débutant en javascript et jquery, merci de votre aide et de vos explication


Le jquery qui est dans le head :

Code :
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
 
<!-- tabs biographie -->
<script type="text/javascript">
$(document).ready(function() {
//Default Action
$(".tab_content").hide(); //Hide all content
$("ul.tabs li:first").addClass("active").show(); //Activate first tab
$(".tab_content:first").show(); //Show first tab content
//On Click Event
$("ul.tabs li").click(function() {
$("ul.tabs li").removeClass("active"); //Remove any "active" class
$(this).addClass("active"); //Add "active" class to selected tab
$(".tab_content").hide(); //Hide all tab content
var activeTab = $(this).find("a").attr("href"); //Find the rel attribute value to identify the active tab + content
$(activeTab).fadeIn(); //Fade in the active content
return false;
});
}); 
</script>

le html :


Code :
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 
<ul class="tabs">
    <li><a href="#tab1"><img src="images/raphael.png"/></a></li>
    <li><a href="#tab2"><img src="images/thomas.png"/></a></li>
</ul>
 
<div class="tab_container">
    <div id="tab1" class="tab_content">
        <div class="biographie">
 
 
        </div>
    </div>
 
    <div id="tab2" class="tab_content">
     <div class="biographie2">
 
     </div>
    </div>
</div>
 
<!--  fin de Tabs -->

Je vous remercie par avance de votre aide.
zup17 est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 06/10/2011, 22h38   #2
Rédacteur
 
Avatar de danielhagnoul
 
Homme Daniel Hagnoul
Étudiant perpétuel
Inscription : février 2009
Messages : 3 221
Détails du profil
Informations personnelles :
Nom : Homme Daniel Hagnoul
Âge : 61
Localisation : Belgique

Informations professionnelles :
Activité : Étudiant perpétuel
Secteur : Enseignement

Informations forums :
Inscription : février 2009
Messages : 3 221
Points : 6 767
Points : 6 767
Bonsoir

Voir le code de http://jqueryui.com/demos/tabs/

Le premier volet est ouvert par défaut.
__________________

FAQ jQuery

Mon cahier d’exercices sur jQuery & Co

Si un message vous a aidé ou vous semble pertinent, votez pour lui !
danielhagnoul est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 07/10/2011, 10h20   #3
Invité de passage
 
Inscription : mars 2008
Messages : 38
Détails du profil
Informations forums :
Inscription : mars 2008
Messages : 38
Points : 2
Points : 2
Citation:
Envoyé par danielhagnoul Voir le message
Bonsoir

Voir le code de http://jqueryui.com/demos/tabs/

Le premier volet est ouvert par défaut.

Bonjour,

J'ai oublier de dire que j'utilise les tabs trois fois de suite dans un site one-page en parallax et ça pose un problème les tabs ne sont pas active, elle sont fermer pour les réalisations et design objet et une fois sur deux pour biographie voila l'url : http://www.interior-suite-architecture.fr/ pouvez vous me dire si vous voyez d'ou vient le pb.

Merci de vos réponses
zup17 est déconnecté   Envoyer un message privé Réponse avec citation 00
Réponse Proposer ce sujet en actualité Cette discussion est résolue.
Outils de la discussion



Fuseau horaire GMT +2. Il est actuellement 01h05.


 
 
 
 
Partenaires

Hébergement Web