onglet aléatoire

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu onglet aléatoire

Message par mlle le Mar 1 Juil 2014 - 1:58

bonjour I love you
les onglets de ma PA sont comme aléatoire, j'ai beua avoir mis le code "selected" dans ma div, comme indiqué, mais parfois l'onglet 1 est à la place de l'onglet 2 et parfois tout reviens dans son sens, bref, j'ai essayer plusieurs manières de faire autrement mais je n'y arrive pas. pourtant j'ai suivi les insctructions  Embarassed Embarassed 

est-ce que quelqu'un aurait une idée d'où était mon erreur ?  silent 

Code:
.infobulle{position: relative;z-index: 0;}
 
.infobulle:hover{background-color: transparent;z-index: 50;}
 
.infobulle span{
position: absolute;
background-color: #CCCCCC;
padding: 5px;
left: -1000px;
visibility: hidden;
color: #FFFFFF;}
 
.infobulle span img{
border: 1px;
padding: 5px;}
 
.infobulle:hover span{
visibility: visible;
top: 30px;
left: 190px;
width: 70px ;
color:#000;
opacity:.9;}

Code:
<div class="systab2 s_slide">
               
               <div class="selected">
                   <span style="font-family: dorsa;  color: #425D6E;  text-transform: uppercase; font-size:20px; letter-spacing:2px; font-family: Dorsa;">contexte</span>
                  <div class="just">
                      L'utopie. Le rêve de tout à chacun. La réalisation d’un seul but : le bonheur. Pourtant, là où des civilisations ont échoué, une ville semble avoir réussi. Depuis quand est-elle là ? Une centaine d'année peut-être. Peut-être plus, peut-être moins. Nul ne le sait et ne le saura jamais. Mais cela importe bien peu. En son sein, la population est divisée en cinq factions, chacune possédant ses fonctions, ses couleurs et ses idéaux. Ainsi, naquirent les Altruistes, les Sincères, les Fraternels, les Érudits et les Audacieux. <a href="#">En savoir plus ...</a>
                  </div>
                  
               </div>
               
               <div>
                   <span style="font-family: dorsa;  color: #425D6E;  text-transform: uppercase; font-size:20px; letter-spacing:2px; font-family: Dorsa;">intrigue</span>
                  <div class="just">
                      Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
                  </div>
                  
               </div>
               

Code:
$(function(){
  var d=function(){if($(this).is(".selected")) return;var a=$(this).closest(".systab2");a.find(".selected").removeClass("selected").filter(".content")[a.is(".s_slide")?"slideUp":a.is(".s_fade")?"fadeOut":"hide"](+((a.attr("class")||"").match(/^[sS]*(?:^|s)s_trans([0-9]+)(?:s|$)[sS]*$/)||["",500])[1]);$(this).addClass("selected").data("content").addClass("selected").stop(!0,!0)[a.is(".s_slide")?"slideDown":a.is(".s_fade")?"fadeIn":"show"](+((a.attr("class")||"").match(/^[sS]*(?:^|s)s_trans([0-9]+)(?:s|$)[sS]*$/)||["",500])[1])};$("div.systab2").each(function(){var a=$("> div",this).detach(),c=[],b;$(this).html('<div class="'+($(this).is(".s_bottom")?"contents":"tabs")+'"></div><div class="'+($(this).is(".s_bottom")?
"tabs":"contents")+'"></div>');$(a).each(function(){b=$(this).children(":first");b.is("span")?(c=$(c).add($(b).addClass("tab").data("content",$(this))),$(this).addClass("content").data("tab",b)):$(this).remove()});$("> div.tabs",this).append(c);$("> div.contents",this).append(a);b=$(".content:first,.content.selected",this).last();$(b).addClass("selected").siblings().hide();$(b).data("tab").addClass("selected")}).on("click",".tab",d).filter(".s_hover").on("mouseenter",".tab",d)
});


Dernière édition par mlle le Mar 8 Juil 2014 - 21:55, édité 1 fois

mlle
***

Messages : 106
Inscrit(e) le : 07/10/2012

http://concordia-u.forumgratuit.ch/
mlle a été remercié(e) par l'auteur de ce sujet.

Résolu Re: onglet aléatoire

Message par demeter1 le Mar 1 Juil 2014 - 2:10

En ayant rapidement regardé le tutoriel, je ne vois aucune trame html qui débute par
Code:
<div class="systab2 s_slide">

il y a bien
Code:
<div class="systab s_bottom s_slide s_hover">

demeter1
+ Hyperactif +

Masculin
Messages : 8222
Inscrit(e) le : 23/01/2009

http://altitudetropicale.forums-actifs.com/index.forum
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: onglet aléatoire

Message par mlle le Mar 1 Juil 2014 - 3:14

c'est un effet de transition, ça n'explique pas pourquoi parfois l'onglet deux se mets devant l'onglet un et parfois l'inverse, tout marche mais il échange parfois les positions et c'est dérangeant Embarassed

mlle
***

Messages : 106
Inscrit(e) le : 07/10/2012

http://concordia-u.forumgratuit.ch/
mlle a été remercié(e) par l'auteur de ce sujet.

Résolu Re: onglet aléatoire

Message par mlle le Jeu 3 Juil 2014 - 16:37

up ?

mlle
***

Messages : 106
Inscrit(e) le : 07/10/2012

http://concordia-u.forumgratuit.ch/
mlle a été remercié(e) par l'auteur de ce sujet.

Résolu Re: onglet aléatoire

Message par demeter1 le Mar 8 Juil 2014 - 19:59

Bonsoir mlle,

Juste pour voir si je réussi à trouver le soucis , j'ai reporté les informations sur mon forum d'essai. hormis un texte intitulé conteste et un autre intitulé intrigue, je ne constate aucun onglet.

Voir ce forum : http://crevettes-passion.forumgratuit.org

demeter1
+ Hyperactif +

Masculin
Messages : 8222
Inscrit(e) le : 23/01/2009

http://altitudetropicale.forums-actifs.com/index.forum
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: onglet aléatoire

Message par mlle le Mar 8 Juil 2014 - 20:19

oh, c'est une erreur de CSS j'ai donnée l'infobulle au lieu du systab.
Code:
/* .systab2 .contents => les conteneurs des contenus associés aux onglets  */
.systab2 .contents {
  margin-top: 1px;
  margin-bottom: 1px;
}
/* style des onglets si ils sont à gauche ou à droite */
.systab2.s_float .tab,.systab2.s_float .tab {
  display: block;
  margin: 5px;
}
/* flottement des conteneurs si les onglets sont à gauche où à droite */
.systab2.s_float .tabs,.systab2.s_float .contents {
  float: left;
}
.just {
  width: 230px;
  height: 110px;
  text-align: justify;
  overflow: auto;
}

mlle
***

Messages : 106
Inscrit(e) le : 07/10/2012

http://concordia-u.forumgratuit.ch/
mlle a été remercié(e) par l'auteur de ce sujet.

Résolu Re: onglet aléatoire

Message par demeter1 le Mar 8 Juil 2014 - 20:42

Re,
toujours pas d'onglets, juste deux overflow sur les textes précités.
Js tenté sur index et sur toutes les pages mais soucis identique.

le html ne contient effectivement que contexte et intrigue.

demeter1
+ Hyperactif +

Masculin
Messages : 8222
Inscrit(e) le : 23/01/2009

http://altitudetropicale.forums-actifs.com/index.forum
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: onglet aléatoire

Message par mlle le Mar 8 Juil 2014 - 21:54

merci I love you

mlle
***

Messages : 106
Inscrit(e) le : 07/10/2012

http://concordia-u.forumgratuit.ch/
mlle a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum