Onglet coulissant ne fonctionne plus

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

Résolu Onglet coulissant ne fonctionne plus

Message par Fred1208 le 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
***

Masculin
Messages : 115
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 le 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
***

Masculin
Messages : 115
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 le Mer 17 Juil 2013 - 18:32


Adam_sfp
+ Hyperactif +

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

http://antonyadam.1fr1.net/portal.htm
Adam_sfp a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Onglet coulissant ne fonctionne plus

Message par Fred1208 le 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
***

Masculin
Messages : 115
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 le 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
+ Hyperactif +

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

http://antonyadam.1fr1.net/portal.htm
Adam_sfp a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Onglet coulissant ne fonctionne plus

Message par Fred1208 le Jeu 18 Juil 2013 - 11:07

Merci beaucoup, cela remarche !! Very Happy

Bonne journée,

Fred 


Fred1208
***

Masculin
Messages : 115
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


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