11521 sujets

JavaScript, DOM et API Web HTML5

JQuery ne fonctionne pas sur mon ordinateur

SALUT LA FAMILLE !!

je viens s'il vous plaît solliciter votre aide !

je suis débutant en jQuery et j'éprouve une peine à exécuter mon Script !

Voilà j'ai d'abord commencer par créer ma structure HTML que voici !!!

<!DOCTYPE html>
<html lang="Fr">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>jQuery Fundamentals</title>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/design.css">
<!--    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.slim.min.js">-->
    
    <script src="js/jquery-3.3.1.slim.min.js"></script>
    <script src="js/test.js"></script>
</head>

<body>
   
   <div class="container-fluid main">
        <div class="container main-content">
            
            <div id="anim_box" class="anim_box text-center text-uppercase">
                <h1 class="h1">ceci n'est pas une boîte</h1>
            </div>
            
        </div>
   </div>
   
   
    <script src=""></script>
</body>
</html>


ensuite je l'ai décorer sur mon fichier css que voici :

@charset "utf-8";

/*Font used : 
font-family: 'Courgette', cursive;
font-family: 'Open Sans', sans-serif;*/

*{
	padding: 0; margin: 0;
}

.main{
    margin-top: 200px;
}

.main-content{
    padding: 20px; width: 500px; background-color: crimson;
}


et pour finir j'ai appliquer mon script jQuery que...voi...ci :


$(document).ready(function(){
                  
                 $('.anim_box').hide(1000);
            
});


Le problème c'est que sur ma machine, la fluidité de l'animation ne s'exécute pas, le texte disparaît, le bloc rétrécit, et il est toujours là.....MAIS LA TRANSITION NE S'EXECUTES PAS Smiley decu

s'incèrement j'ai beaucoup cherché(et réfléchit) avant de venir vous embêter avec çà et là.....je suis épuisé quoi !!! S'il vous plaît aidez-moi !!! Smiley bawling Smiley bawling Smiley bawling
Modifié par Banakin_Skywalker (10 Mar 2019 - 09:14)
Modérateur
Salut,


le bloc anim_box avec le texte disparaît bien avec une animation :
https://jsfiddle.net/undless/bpe6thy7/1/

Si tu n'a pas d'animation chez toi c'est que tu as mal importé jquery

Si tu t'étonne qu'il y ai encore le bloc couleur crimson c'est parce que tu fait disparaître anim_box et que la couleur est sur le bloc .main-content.
Si dans ta console navigateur tu as :

Undefined index "$"

c'est que oui, tu as mal importé Jquery.
Hello la famille! Le problème est réglé et encore merci pour votre soutient.
En fait il me fallait simplement implémenter mon jQuery dans le Head et mon script.js dans le body, je l'ai fait et tout est rentrer de l'ordre Smiley cligne !!!

Que La Force Soit Avec Vous
Modérateur
Banakin_Skywalker a écrit :
En fait il me fallait simplement implémenter mon jQuery dans le Head et mon script.js dans le body
Smiley hum
@_laurent ! Je voulais simplement dire ''insérer'' mon Script jQuery et non ''implémenter'' ! (erreur de débutant Smiley ravi ), sur ce...!!!
Modifié par Banakin_Skywalker (11 Mar 2019 - 14:59)
Sujet clos
Aller à