Onglet coulissant ne fonctionne plus

2 participants

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

Résolu Onglet coulissant ne fonctionne plus

Message par Fred1208 Mer 17 Juil 2013 - 15:08

Bonjour,

J'ai installé sur mon forum www.forseps.org à gauche et à droite 3 onglets coulissants qui fonctionnaient très bien, grâce à Themes FA.
Aujourd'hui le Js que j'avais copié ne fonctionne plus :http://s3.archive-host.com/membres/up/1696114791/java/rejquery-132.js

Auparavant lorsque la page se chargeait, chaque onglet partait d'une position à 70Px à gauche et -70 Px à droite, et le corps de chaque onglet "rentrait' dans son bord respectif (à gauche et à droite) pour ne laisser apparaître que la rubrique de l'onglet (J'ai modifié à 0px de marge pour qu'on voie la totalité des onglets). Au survol d'un onglet, il se dépliait pour apparaître dans sa totalité avec l'image, et les deux autres restaient "rentrés".

Aujourd'hui ils sont tous dépliés fixes, plus d'animation.

Pourriez vous me redonner un JS pour que cela marche à nouveau?

Merci de votre aide,

Fred


Dernière édition par Fred1208 le Jeu 18 Juil 2013 - 11:07, édité 1 fois
Fred1208

Fred1208
***

Masculin
Messages : 121
Inscrit(e) le : 29/04/2010

http://www.forseps.org
Fred1208 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Onglet coulissant ne fonctionne plus

Message par Fred1208 Mer 17 Juil 2013 - 17:52

Ma page html :

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
    <head>
        <title>navigation jQuery</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<script type="text/javascript" src="http://s3.archive-host.com/membres/up/1696114791/java/rejquery-132.js"></script>

<style>

ul#bouton {
position: fixed;    /* On fixe les boutons */
margin: 0px;        /*  marge extérieure */
padding: 0px;        /*  marge intérieure  */
top: 150px;          /* positionné à 50px du haut  */
right: 0px;          /* positionné à 0px du bord gauche */
list-style: none;    /* pas de style pour la liste */
z-index:9999;        /* place les boutons au dessus de tout le reste */
}

ul#bouton li {
width: 90px;          /* largeur du bouton */
margin-bottom: 4px;    /* marge inférieure */
}

a {
display: block;      /* defini en bloc */
margin-left: 0px;  /* marge extérieure négative gauche */
width: 90px;          /* largeur */
height: 70px;          /* hauteur */
background-color:#c7cac6;  /* couleur de fond */
background-repeat:no-repeat;  /* répétition du fond */
background-position:center center;  /* position du fond */
-moz-border-radius:9px 0px 0px 9px;  /* angles arrondis */
-webkit-border-radius:9px 0px 0px 9px; /* angles arrondis */
border-radius:9px 0px 0px 9px;        /* angles arrondis */
border:1px solid #323630;            /* bordure */
-moz-box-shadow: 0px 0px 5px #000;    /* ombre portée */
-webkit-box-shadow: 0px 0px 5px #000;  /* ombre portée */
box-shadow: 0px 0px 5px #000;        /* ombre portée */
opacity: 1;                        /* opacité */
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100); /* opacité pour IE */
}

ul#bouton .galerie a{
 background-image: url(http://i45.servimg.com/u/f45/15/15/36/09/retrov10.jpg);
}
ul#bouton .discut a{
    background-image: url(http://i45.servimg.com/u/f45/15/15/36/09/souche10.jpg);
}
ul#bouton .codes a{
    background-image: url(http://i45.servimg.com/u/f45/15/15/36/09/recher10.jpg);

}
ul#bouton .commande a{
    background-image: url(adresse de l'image);
}
ul#bouton .contact a{
    background-image: url(adresse de l'image);
}

</style>

    </head>

    <body>

        <ul id="bouton">
 
            <li class="galerie"><a target="_parent" href="http://www.forseps.org/f22-retrovirus-endogene-herv-w-7q"></a></li>
<li class="discut"><a target="_parent" href="http://www.forseps.org/f13-cellules-souches"></a></li>
<li class="codes"><a target="_parent" href="http://www.forseps.org/f10-autres-traitements-et-recherche"></a></li>

        

        </ul>

        <script type="text/javascript">
            $(function() {
                $('#bouton a').stop().animate({'marginLeft':'65px'},1000);

                $('#bouton > li').hover(
                    function () {
                        $('a',$(this)).stop().animate({'marginLeft':'-2px'},200);
                    },
                    function () {
                      $('a',$(this)).stop().animate({'marginLeft':'65px'},200);
                    }
                );
            });
        </script>

  </body>
</html>
Fred1208

Fred1208
***

Masculin
Messages : 121
Inscrit(e) le : 29/04/2010

http://www.forseps.org
Fred1208 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Onglet coulissant ne fonctionne plus

Message par Adam_sfp Mer 17 Juil 2013 - 18:32

Adam_sfp

Adam_sfp
Membre actif

Masculin
Messages : 4465
Inscrit(e) le : 18/04/2008

http://antonyadam.kanak.fr
Adam_sfp a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Onglet coulissant ne fonctionne plus

Message par Fred1208 Mer 17 Juil 2013 - 18:53

Bonjour,

Merci de votre réponse.
J'ai lu le sujet, mais je n'ai pas trouvé de réponse concernant mon Js qui ne fonctionne plus pour lancer l'animation..

Bonne journée,

Fred
Fred1208

Fred1208
***

Masculin
Messages : 121
Inscrit(e) le : 29/04/2010

http://www.forseps.org
Fred1208 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Onglet coulissant ne fonctionne plus

Message par Adam_sfp Mer 17 Juil 2013 - 19:21

Bonjour

Désolé j'ai regardé un peu vite..
C'est le lien de  la librairie JQuery qui n'est plus bon vous pouvez mettre

Code:
       <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

A la place de

Code:
<script type="text/javascript" src="http://s3.archive-host.com/membres/up/1696114791/java/rejquery-132.js"></script>

Cdt.
Adam_sfp

Adam_sfp
Membre actif

Masculin
Messages : 4465
Inscrit(e) le : 18/04/2008

http://antonyadam.kanak.fr
Adam_sfp a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Onglet coulissant ne fonctionne plus

Message par Fred1208 Jeu 18 Juil 2013 - 11:07

Merci beaucoup, cela remarche !! Very Happy

Bonne journée,

Fred 

Fred1208

Fred1208
***

Masculin
Messages : 121
Inscrit(e) le : 29/04/2010

http://www.forseps.org
Fred1208 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