Animation des titres de topics : navigation impossible !

2 participants

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

Résolu Animation des titres de topics : navigation impossible !

Message par Shangri-La Mer 29 Aoû 2012 - 12:21

Bonjour à tous ! ^^

Je viens quérir votre aide car j'ai un petit souci avec mon forum... Je le trouve plutôt joli, esthétique... mais il a un souci d'animation des titres de topics qui rend la navigation impossible ^^" Voici les informations nécessaires :

- http://stallions-evolution.bb-fr.com/
- PHPBB 2 (il me semble)
- Vidéo du problème =>


- Je suis fondatrice
- J'ai modifié les templates index_body et overall_header juste pour une question d'images... a priori rien à voir avec l'animation...
- Pas de CSS personnalisé, sauf le fond d'écran du forum mais je n'ai touché à rien d'autre !
- Je suis sous Google Chrome, mais ça le fait aussi sous Mozilla !

Elle se fait aussi sur les titres des forums et les titres des catégories :s Autant les catégories, ce n'est pas gênant, autant les forums et les topics, c'est parfaitement impossible de naviguer sans prise de tête !

Voilà, si quelqu'un se sent l'âme héroïque pour me venir en aide et supprimer cette animation, je lui en serai reconnaissante cheers


Dernière édition par Shangri-La le Sam 1 Sep 2012 - 13:58, édité 3 fois
avatar

Shangri-La
Nouveau membre

Messages : 15
Inscrit(e) le : 29/08/2012

http://stallions-evolution.bb-fr.com
Shangri-La a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Animation des titres de topics : navigation impossible !

Message par Roxy. Mer 29 Aoû 2012 - 12:30

Bonjour,
Allez dans : P.A > Modules > Gestion des codes Javascript. Avez-vous des codes sur cette page ? Si oui, pouvez vous nous les fournir en cliquant sur edit de chaque code.

Cordialement,
Roxy.

Roxy.
Membre habitué

Féminin
Messages : 1058
Inscrit(e) le : 24/07/2011

http://roxy-test.forumgratuit.org/
Roxy. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Animation des titres de topics : navigation impossible !

Message par Shangri-La Mer 29 Aoû 2012 - 12:43

Malheureusement non, je n'ai aucun code :s Ce serait dans le CSS sinon ? Dois-je le recopier ici ?

Au cas où je le mets :

Code:
body{
  margin: 0px;
  float: left;
  background-image: url('http://i45.tinypic.com/24c5qba.png');
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position:right;
}
.creditxxb{
  font-size: 7px;
  color: #000000;
  opacity: 0.4;
}
.creditxxb:hover{
  font-size: 7px;
  color: #000000;
  text-shadow: 0px 0px 9px #000000;
  opacity: 1;
}
.categtitreuh{
  background-image: url('http://image.noelshack.com/fichiers/2012/28/1342001611-test.png')
}
.colo1{
  display: table-cell;
}

.colo2{
  display: table-cell;
}

.colo3{
  display: table-cell;
}
.categ {
  width: 700px;
  height: 170px;
  background-color: #FFFFFF;
  margin: 0px 10px 0px 10px;
}

.cateimg {
  margin-left: 10px;
}
.titreforum a{
  font-size: 18px;
  color: #000000;
  text-align: center;
  text-decoration: none;
  margin-top: -20px;
}
  .titreforum a:hover{
  font-size: 20px;
  color: #000000;
  text-shadow: 0px 0px 9px #000000;
  align: center;
  text-decoration: none;
  margin-top: -20px;
}
.imgcate{
-webkit-transform: rotate(5deg);
-moz-transform: rotate(5deg);
  margin-top: -20px;
}
.h1,h2{
     font-size:40px;
  width: 100%;
    height: 40px;
  color: #000000;
  margin: auto;
  text-shadow: 0px 0px 9px #FFFFFF;
  -moz-transition : 3s;
-webkit-transition : 3s;
-o-transition : 3s;
transition : 3s;
    }
.h1,h2:hover{
  font-size:40px;
  width: 100%;
    height: 40px;
  color: #FFFFFF;
  text-shadow: 0px 0px 9px #000000;
  margin-left: 500px;
}
.fondcateg{
  width: 740px;
  height: 100%;
  background-color: #000000;
  border-width: 0px 5px 0px 5px;
  border-style: solid;
  border-color: #FFFFFF;
}
.statscateg{
  width: 120px;
  height: 100px;
  background-color: #000000;
  float: right;
  font-size: 13px;
  color: #FFFFFF;
}
.descricateg{
  width: 450px;
  height: 100%;
}
.descricateg2{
  width: 350px;
  height: 100px;
  background-color: #000000;
float: center;
    overflow: auto;
  color: white;
}
.groupequeel{
  width: 130px;
  height: 30px;
  background-color: #FFFFFF;
  box-shadow: 0px 0px 9px #000000;
  display: inline-block;
  color: #000000;
  font-size: 15px;
  margin: 10px;
  padding-top: 10px;
  text-decoration: none;
}

.fondqeel{
  width: 740px;
  height: 100%;
  background-color: #000000;
  border-width: 0px 5px 0px 5px;
  border-style: solid;
  border-color: #FFFFFF;
}
.qele {
  width: 700px;
  height: 100%;
  background-color: #FFFFFF;
  margin: 0px 10px 0px 10px;
}
.lienqeel:link{
  color: #FFFFFF;
  opacity: 0.6;
  text-decoration: none;
  font-size: 10px;
  margin-left: 10px;
}
a:link{
  text-decoration: none;
}
#navig
{
  width: 950px;
  margin: auto;
  text-align: center;
}
#navigation
{
  position: fixed;
  z-index: 999;
  width: 100%;
  background-color: #FFFFFF;
  border-bottom: 2px solid #000000;
  margin-top: -5px;
  padding: 2px;
}
.copyright{
  width: 100%;
  height: 30px;
  float: center;
  border-top: 2px solid #000000;
  position: fixed;
  background-color: #FFFFFF;
  padding: -5px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  font-size: 10px;
  word-spacing: 10px;
text-decoration: none;
}


/* PREZ*/
.prez{
width : 500px;
height : 30px;
background-color: #000000;
-moz-transition : all 2s;
-webkit-transition :  all 2s ease 0;
-o-transition : all 2s;
transition : all 2s;
overflow: hidden;
margin-bottom: 5px;
}
.prez:hover{
background-color: #FFFFFF;
height: 300px;
border-width: 2px;
border-color: #000000;
border-style: solid;
padding: 5px;
overflow: auto;
margin-bottom: 10px;
}
.preztitre{
width: 498px;
height: 40px;
background-color: #0F0F0F;
text-align: center;
color: #FFFFFF;
border-radius: 0px 0px 20px 20px;
margin-right: 10px;
font-size: 25px;
}
.prezfond{
width: 510px;
height: 100%;
padding: 10px;
background-color: #FFFFFF;
border-width: 2px;
border-color: #000000;
border-style: solid;
align: center;
overflow: hidden;
}
.prezinfos{
width: 300px;
height: 300px;
background-color: #000000;
overflow: hidden;
-moz-transition : all 2s ease;
-webkit-transition : all 2s ease;
-o-transition : all 2s ease;
transition : all 2s ease;
margin-bottom: 10px;
}
.prezinfos:hover{
width: 500px;
height: 300px;
background-color: #000000;
float: center;
margin-bottom: 20px;
margin-right: 20px;
}
.prezinfostexte{
-moz-transition : all 2s ease;
-webkit-transition : all 2s ease;
-o-transition : all 2s ease;
transition : all 2s ease;
color: #FFFFFF;
font-size: 14px;
width: 300px;
height: 300px;
}
.prezinfostexte:hover{
padding: 80px 0px 0px 90px;
}
.preznompre{
word-spacing: 10px;
}
.preznompre:hover{
letter-spacing: 4px;
}
.prezautre{
  width: 490px;
  height: 200px;
  background-color: #000000;
  margin-left: 8px;
}
.preztitreautre{
width: 480px;
height: 30px;
background-color: #FFFFFF;
text-align: center;
color: #000000;
border-radius: 0px 0px 20px 20px;
font-size: 25px;
margin-left: 5px;
border-top: 2px solid #000000;
}
.preztexte2{
  color: #FFFFFF;
}

/*PA*/
.pafond{
  width: 730px;
  height: 600px;
  background-color: #FFFFFF;
  border-width: 2px;
  border-style: solid;
  border-color: #000000;
  padding-top: 20px;
}
.paparte{
  width: 180px;
  height: 345px;
  background-color: #FFFFFF;
  border-color: #000000;
  border-width: 2px;
  border-style: solid;
}
.patop{
  width: 180px;
  height: 160px;
  background-color: #FFFFFF;
  border-color: #000000;
  border-width: 2px;
  margin-top: 10px;
  border-style: solid;
}
.paclass{
  width: 180px;
  height: 345px;
  background-color: #FFFFFF;
  border-color: #000000;
  border-width: 2px;
  border-style: solid;
}
.pacred{
  width: 180px;
  height: 160px;
  background-color: #FFFFFF;
  border-color: #000000;
  border-width: 2px;
  border-style: solid;
  margin-top: 10px;
}
.pastaff{
  width: 280px;
  height: 130px;
  background-color: #FFFFFF;
  border-color: #000000;
  border-width: 2px;
  border-style: solid;
  margin-top: 10px;
  margin-bottom: 50px;
}
.panew{
  width: 290px;
  height: 140px;
  background-color: #FFFFFF;
  border-color: #000000;
  border-width: 2px;
  border-style: solid;
}
.pacontexte {
  width: 320px;
  height: 220px;
  background-color: #FFFFFF;
  border-color: #000000;
  border-width: 2px;
  border-style: solid;
  margin: 10px;
}
  .parteimg{
  opacity: 0.5;
}
.parteimg:hover{
  opacity: 1;
}
.patitre{
    -moz-transition : 1s;
-webkit-transition : 1s;
-o-transition : 1s;
transition : 1s;
  width: 100%;
  height: 20px;
  font-size: 15px;
  color: #FFFFFF;
  background-color: #000000;
  border-radius: 0px 0px 10px 10px;
}
.patitre:hover{
  font-size: 24px;
  height: 30px;
  margin-top: -10px;
  color: #000000;
  background-color: #FFFFFF;
  border-bottom: 2px solid #000000;
  border-raidus: 0px 0px 20px 20px;
}
.imgtop{
  margin: 2px;
  box-shadow: 0px 0px 9px #000000;
}
avatar

Shangri-La
Nouveau membre

Messages : 15
Inscrit(e) le : 29/08/2012

http://stallions-evolution.bb-fr.com
Shangri-La a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Animation des titres de topics : navigation impossible !

Message par Shangri-La Jeu 30 Aoû 2012 - 23:23

Désolée d'insister mais... personne ? é_è
avatar

Shangri-La
Nouveau membre

Messages : 15
Inscrit(e) le : 29/08/2012

http://stallions-evolution.bb-fr.com
Shangri-La a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Animation des titres de topics : navigation impossible !

Message par Shangri-La Sam 1 Sep 2012 - 11:00

Ce n'est pas dans mes habitudes de "upper", mais je souhaiterais vraiment avoir un beau forum sans ce souci qui rend la navigation impossible Sad

J'ai vraiment besoin de votre aide...
avatar

Shangri-La
Nouveau membre

Messages : 15
Inscrit(e) le : 29/08/2012

http://stallions-evolution.bb-fr.com
Shangri-La a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Animation des titres de topics : navigation impossible !

Message par Invité Sam 1 Sep 2012 - 11:49

Salut ,

ton erreur se trouve ici:

Code:
 
 .h1,h2{
        font-size:40px;
      width: 100%;
        height: 40px;
      color: #000000;
      margin: auto;
      text-shadow: 0px 0px 9px #FFFFFF;
      -moz-transition : 3s;
    -webkit-transition : 3s;
    -o-transition : 3s;
    transition : 3s;
        }
    .h1,h2:hover{
      font-size:40px;
      width: 100%;
        height: 40px;
      color: #FFFFFF;
      text-shadow: 0px 0px 9px #000000;
      margin-left: 500px;
    }

Supprimes et remplace par ceci:
Code:

/*Titre catégorie*/
.secondarytitle h2
{
        font-size:40px;
      width: 100%;
        height: 40px;
      color: #000000;
      margin: auto;
      text-shadow: 0px 0px 9px #FFFFFF;
      -moz-transition : 3s;
    -webkit-transition : 3s;
    -o-transition : 3s;
    transition : 3s;
        }
/*Titre catégorie au survol*/
.secondarytitle h2:hover
{
      font-size:40px;
      width: 100%;
        height: 40px;
      color: #FFFFFF;
      text-shadow: 0px 0px 9px #000000;
      margin-left: 500px;
    }
/*Titre des forums au survol*/
.hierarchy:hover
{
      font-size:11px;
      width: 100%;
        height: 40px;
      color: #FFFFFF;
      text-shadow: 0px 0px 9px #000000;
      margin-left: 10px;
    }




a++
Anonymous

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Animation des titres de topics : navigation impossible !

Message par Shangri-La Sam 1 Sep 2012 - 13:57

Ouah *_* ça c'est de l'efficacité ! J'édite le sujet et je le mets comme résolu...

Merci encore, je commençais à fatiguer de devoir courir après ces titres fugueurs de curseur ! Mad

Bonne journée ! thumleft
avatar

Shangri-La
Nouveau membre

Messages : 15
Inscrit(e) le : 29/08/2012

http://stallions-evolution.bb-fr.com
Shangri-La a été remercié(e) par l'auteur de ce sujet.

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

- Sujets similaires

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