Bonjour !
Je suis en train de créer une page pour mon site mais le probleme est qu'elle ne charge pas le jquery , j'ai beau l'inclure dans une page à part où via un lien rien ne se passe ... Je ne sais pas d'où cela peut venir . Auriez-vous une idée ? merci !
Non désolé je rentre chez moi dans deux semaines , peut être que nous pourrons en reparler à ce moment là ?
Bonsoir,
Possible d'avoir un lien ou de voir ton code ?
Bonjour , désolé je ne suis pas chez moi donc je n'ai pas accès au code avant un petit moment .
Tu ne donne pas assez de détails @Nagraria.
Autant de détails qui nous permettent de te répondre précisémment.
D'emblée comme ça, j'ai envie de dire que si tu le charges en local, c'est que le chemin n'est pas bon, essaye de le charger via un CDN et teste :
Oui pardon , je n'ai pas été très précis , je fais mon site en local , je charge la version 1.11.3, j'ai essayé en local et via un CDN , mais je n'est pas essayé avec la version 2.1.3 .J'ai essayé de le charger dans le head et en fin de page mais le résultat était le même . Je test le code dès que je peux , merci pour vos réponses !
Ps : Je n'utilise ni CMS ni framework .
Un aperçu des quelques lignes de code que tu utilises nous aideraient à t'aider plus facilement. Peux-tu faire un copier-coller ?
Ok merci , je suis sous wamp mais j'essayerais !
Bonjour,
je pense que boostyweb.fr est dans le vrai tu dois tenter de charger jquery en local mais si ton url ressemble à ça
et que tu n'es pas sous wamp, il ne chargera pas la bibliothèque.
il faut que ton url ressemble bien à
bon courage
Oui je n'avais pas pensé à ça Underscreen. Je pense que d'ici 2 semaines tu aura régler ton problème Nagraria :) Sinon n'hésites pas à revenir avec un peu plus de précisions ;) @+
normalement sous wamp ça ne devrait pas posé de problème.
Il faut regarder du coté de l'inspecteur d'élément voir ce qu'il te dit !
Rebonjour , j'ai tésté avec le lien que vous m'avez donné ,mais toujours rien .J'ai essayé de placer le js dans le head et dans le body mais le résultat est le même ... voilà le code de ma page :
Merci de votre aide !
Salut,
Comment testes-tu si jQuery a bien été inclus ?
2 questions :
tu peux tester en incluant un script Jquery basique, par exemple qui change la couleur du background du body.
Pour cela ajoute ceci après ton chargement de jquery:
il y a sûrement une autre façon plus clean de le tester, mais si ton background devient rouge... jQuery fonctionne :)
Bonjour !
Pour les balises php j'ai juste mal copié colé mais elles sont présentes dans mon code .
Sinon j'ai tésté ta méthode boostyweb, et le background devient rouge ! Ca veut donc dire que le jquery fonctionne , mais pourtant lorsque j'inclue a la page ce css :
*{
box-sizing:border-box;
}
@font-face {
font-family: 'app';
src: url('font/app.eot?23297456');
src: url('font/app.eot?23297456#iefix') format('embedded-opentype'),
url('font/app.woff?23297456') format('woff'),
url('font/app.ttf?23297456') format('truetype'),
url('font/app.svg?23297456#app') format('svg');
font-weight: normal;
font-style: normal;
}
[class^="i-"]:before, [class*=" i-"]:before {
font-family: "app";
font-style: normal;
font-weight: normal;
display: inline-block;
text-decoration: inherit;
width: 1em;
margin-right: .2em;
text-align: center;font-variant: normal;
text-transform: none;line-height: 1em;
margin-left: .2em;
font-size: 125%;
}
.i-user:before { content: '\e801'; } / '' /
.i-send:before { content: '\e802'; } / '' /
body{
font-family: Roboto;
margin: 0;
padding: 0;
}
.container{
width:100%;
position:relative;
top:60px;
padding: 5px 2%;
}
.topbar{
background-color: #34495e;
height:60px;
width:100%;
line-height: 60px;
padding:0 2%;
position:fixed;
top:0px;
color: #FFF;
}
.topbar .app-name{
color:inherit;
text-decoration:none;
font-size:21px;
font-weight:500;
}
.topbar .menu{
position:absolute;
right:10px;
}
.topbar .menu a{
color:inherit;
text-decoration:none;
float:left;
padding:0 15px;
}
.topbar .menu a:hover{
background-color: #2c3e50;
}
.topbar .menu a.active{
background-color: #2c3e50;
}
.field{
position: relative;
height: 72px;
padding: 16px 0 8px 0;
}
.field-label{
position: relative;
margin: 0;
display: block;
color: #bfbfbf;
line-height: 16px;
font-size: 16px;
font-weight: 400;
transform: translateY(24px);
transition: transform 0.3s, color 0.3s;
transform-origin: 0 50%;}
.field-input{
position: relative;
display: block;
width: 100%;
height: 32px;
padding: 8px 0;
line-height: 16px;
font-family: Roboto;
font-size: 16px;
background: transparent;
border: none;
-webkit-appearance: none;
outline: none;}
.field-area{
heaight:auto;
padding-top:5px;
width:90%;
}
.field::after, .field::before{
content:'';
height: 2px;
width: 100%;
position: absolute;
bottom: 6px;
left: 0;
background-color: #e6e6e6;}
.field::after{
background-color: #2195F2;
transform: scaleX(0);
transition: transform 0.3s;
}
.has-label .field-label{
transform: translateY(0) scale(0.75);
}
.is-focused .field-label{
color: #2195F2;
}
.field.is-focused::after{
transform: scaleX(1);
}
.field.error .field-label{
color: #e74c3c;
}
.field.error::after{
background-color: #e74c3c;
}
button{
background-color:#34495e;
border:2px solid #34495e;
display:block;
width:100%;
height:36px;
color:#fff;
border-radius:2px;
cursor:pointer;
font-size:16px;
margin:5px 0;
outline:none;
}
button:hover{
background:none;
color:#34495e;
}
.header{
display: block;
border-bottom: 2px solid #000;
}
.header.header-form{
margin-bottom:-8px;
}
p.error{
color: #e74c3c;
}
.membre{
display:block;
background-color:#ccc;
padding:10px 10px;
margin-bottom:10px;
box-shadow:1px 2px 5px 1px rgba(0, 0, 0, 0.4);
position:relative;
border-radius:2px;
}
.membre .select{
position:absolute;
right: 10px;
top: 9px;
background-color:#3498db;
color:#fff;
display:block;
width:40px;
height:40px;
border-radius:50%;
text-align:center;
line-height:40px;
}
.membre .select:hover{
background-color:#2980b9;
}
.bottom{
position:fixed;
background-color:#fff;
bottom:0px;
width:96%;
}
.bottom .send{
background-color:#34495E;
color:#fff;
position:absolute;
right:0px;
top:25px;
width:38px;
border-radius:50%;
padding:0;
font-size:12px;
outline:none;
}
.bottom .send:hover{
background-color: #2C3E50;
}
.maessages-box{
position:relative;
background-color:#fff;
margin-bottom:95px;
}
.messages-box .message{
padding: 3px 8px;
margin:3px 0;
border-radius:12px;
max-width:75%;
display:inline-block;
min-height:25px;
}
.messages-box .message.message-membre{
background-color:#3498db;
float:right;
}
.messages-box .message.message-user{
background-color:#bdc3c7;
}
rien ne se passe lorsque je click sur les inputs alors qu'ils devraient devenir plus petit et bleu .
En fait je suis un tuto de nickwalle , j'ai suivi les étapes une à une et je ne comprend pas pourquoi ça ne marche pas ...
Une idée ?
Merci !
Salut,
Dans ton dernier message, ce que tu nous montres c'est du CSS. Tu dois te mélanger un peu les pinceaux et du coup c'est pas du tout clair ton problème :/
Tu mélanges tous les sujets dans ton post :) Déjà comme j'ai répondu à ta question plus haut sur le test de l'inclusion de Jquery, tu peux valider ma réponse :D
Pour le reste est du domaine de l'HTML/CSS, rien à voir avec Jquery, sauf si tu as un script JS présent qui définit la taille et la couleur de tes éléments inputs au clic. Dans ce cas, s'il ne fonctionne pas, inclue ton script JS de la même manière que je l'ai fait dans mon exemple plus haut, en attendant que jquery soit bien chargé.
PS: le html de ton formulaire permettrait de voir si ton CSS fait bien ce que tu veux sur ces éléments inputs (ont-ils un id ou une classe particulière que l'on retrouve dans ton CSS ? ...)
Oui désolé si je ce n'est pas claire, je ne connaissais pas du tout jquery avant de suivre ce tuto donc je ne sais pas comment il fonctionne :)
voici le html du formulaire , avec les classes et les id du css :
Re bonjour tout le monde !
Merci à vous tous pour votre aide j'ai enfin trouvé le problème ! Merci Boosty web tu avais raison c'était mon script js qui posait problème .
Je l'ai changé , et ça fonctionne !
Merci pour votre patience et votre aide !
ok ;) Cool si ça marche ;)