Certains codes javascript ne fonctionnent plus

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

Résolu Certains codes javascript ne fonctionnent plus

Message par Hyarmentir le Mar 8 Aoû 2017 - 17:34

Détails techniques


Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Moi uniquement
Lien du forum : (lien masqué, vous devez poster pour le voir)

Description du problème

Bonjour (:

Ouverture d'un petit sujet suite à un soucisavec mes codes javascript.
Je m'en suis aperçu alors que j'étais en plein milieu d'un code à onglets difficile, et en isolant l'effet que je voulait sans les dits onglets ils m'est apparu que le code Javascript ne fonctionnait pas. Or, celui-ci fonctionne bien sur un logiciel et sur CodePen, je l'avais nettoyé et devrait tourner sans problème normalement.
J'avais ajouté il y'a quelques jours un autre code (effacé depuis) qui ne tournait pas non plus et j'avais mis ça sur l'annulation de deux scripts puisqu'aucun ne répondait, mais je me demande maintenant si le problème ne vient pas d'ailleurs. Mauvais langage ? Mauvais emplacement ? Ordre d'exécution qui écrase l'un ou l'autre code ?
N'étant pas un expert je viens donc tenter ma chance ici et vous remercie d'avance ♥

Voici le Javascript :
Code:
var bodyObj, className, index;

bodyObj = document.getElementById("pv");
index = 1;
className = ["llimgPV", "llimgPVop"];

function updateIndex() {
  if (index === 0) {
    index = 1;
  } else {
    index = 0;
  }
}

bodyObj.onclick = function(e) {
  e.currentTarget.className = className[index];
  updateIndex();
};

la partie CSS concernée :
Code:
#pv {
    height: 100%;
    width: 100%;
}

#pv.limgPV {
  clip-path: polygon(50% 0%, 93.30127% 25%, 93.30127% 75%, 50% 100%, 6.69873% 75%, 6.69873% 25%);
  width: 100px;
  height: 100px;
  background-size: cover;
  background-position:50% 50%;
  background-size:125px;
  opacity:0.5;
}

#pv.limgPVop {
  clip-path: polygon(50% 0%, 93.30127% 25%, 93.30127% 75%, 50% 100%, 6.69873% 75%, 6.69873% 25%);
  width: 100px;
  height: 100px;
  background-size: cover;
  background-position:50% 50%;
    background-size:125px;
  float:left;
}

et le code HTML nécessaire pour cet effet :
Code:
<div id="pv" class="llimgPV" style="background-image: url('http://i.imgur.com/nenNvDe.gif');"></div>
(l'effet ici est que lorsqu'on clique sur l'image elle est considérée comme active et retrouve son opacité totale) (c'est du bidouillage, je sais qu'il est possible de faire autrement mais ne me convient pas puisque nécessité que l'utilisateur modifie lui-même l'URL, et surtout, c'est le Javascript qui ne répond pas, le code fonctionnant normalement ailleurs)

Merci encore et bonne journée (:
avatar

Hyarmentir
Nouveau membre

Messages : 11
Inscrit(e) le : 08/08/2017

http://thetta-reddast.forumactif.com
Hyarmentir a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Certains codes javascript ne fonctionnent plus

Message par Neptunia le Mar 8 Aoû 2017 - 17:51

Bonjour, et bienvenue sur le Forum des Forums Forumactif


Pourrions nous avoir un lien accessible sans se connecter où le code est en place ?

J'ai placé le script (sur l'index), le HTML (message page d'accueil) et le CSS et je n'ai absolument rien sur mon forum test.

avatar

Neptunia
Membre actif

Féminin
Messages : 12440
Inscrit(e) le : 08/08/2010

https://www.galaxie-series.net/
Neptunia a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Certains codes javascript ne fonctionnent plus

Message par Hyarmentir le Mar 8 Aoû 2017 - 18:31

Bonjour (:
Déjà, un grand merci pour cette réponse très rapide, et mes excuses j'étais persuadé avoir ouvert le forum.

Est-ce que ce sujet-ci est désormais bien visible ?

Et ici ( http://codepen.io/anon/pen/YxZJQr ) le code en prévisualisation sur Code Pen qui fonctionne bien quand on clique sur l'image. (il n'est pas nécessaire de s'incrire sur le site)

Encore merci d'avance !
avatar

Hyarmentir
Nouveau membre

Messages : 11
Inscrit(e) le : 08/08/2017

http://thetta-reddast.forumactif.com
Hyarmentir a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Certains codes javascript ne fonctionnent plus

Message par Neptunia le Mar 8 Aoû 2017 - 18:48

Hyarmentir a écrit:et mes excuses j'étais persuadé avoir ouvert le forum.

Est-ce que ce sujet-ci est désormais bien visible ?

Et ici ( http://codepen.io/anon/pen/YxZJQr ) le code en prévisualisation sur Code Pen qui fonctionne bien quand on clique sur l'image. (il n'est pas nécessaire de s'incrire sur le site)

Encore merci d'avance !

Bah en fait comme l'adresse du forum est masquée, j'avais directement implanté css js et html sur un fofo test sans aucun résultat visible. Même pas pensé à regarder le lien de votre profil.

La console relève une erreur dans votre javascript
TypeError: bodyObj is null

Right https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Erreurs/Unexpected_type

Je ne pourrais malheureusement pas vous aider davantage, suis déjà très limitée en jQuery, mais javascript bah c'est encore pire Sad
avatar

Neptunia
Membre actif

Féminin
Messages : 12440
Inscrit(e) le : 08/08/2010

https://www.galaxie-series.net/
Neptunia a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Certains codes javascript ne fonctionnent plus

Message par no_way le Mar 8 Aoû 2017 - 19:17

Bonjour, vous essayez d'assigner l'élément avec pour id "pv" à la variable bodyObj mais au moment de l’exécution du script le DOM n'est pas encore chargé, l'élément n'existe donc pas encore ...

Mettez votre code entre ces lignes:
Code:
$(function(){
VOTRE CODE
});

Sinon, utiliser un id n'est pas forcément le mal absolu mais assurez-vous qu'il n'y aura qu'une occurrence de ce dernier dans votre page dans pareil cas !


Dernière édition par no_way le Mar 8 Aoû 2017 - 19:20, édité 1 fois


avatar

no_way
Aidactif
Aidactif

Messages : 1952
Inscrit(e) le : 26/03/2010

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

Résolu Re: Certains codes javascript ne fonctionnent plus

Message par demeter1 le Mar 8 Aoû 2017 - 19:18

Bonjour à vous deux,
n'est il pas tout simplement possible d'utiliser la pseudo-classe :active plutôt que du js ?
avatar

demeter1
Membre actif

Masculin
Messages : 8419
Inscrit(e) le : 23/01/2009

http://altitudetropicale.forums-actifs.com/index.forum
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Certains codes javascript ne fonctionnent plus

Message par no_way le Mar 8 Aoû 2017 - 19:29

Salut Demeter, l'utilisation de la pseudo-classe :active ne permet pas d'avoir pareil résultat, en fait ce qui s'en rapprocherait le plus serait la pseudo-classe :target et ce ne serait toujours l'idéal pour faire basculer l'état, l'idéal serait plutôt d'attribuer un attribut data sur l'élément et dans la mesure où il n'y a que 2 états désirés basculer sa valeur de 0->1->0 etc... par négation.

Tant que j'y suis je vous conseillerais de passer par la méthode on de jQuery pour attacher vos écouteurs d'événements:
http://api.jquery.com/on/


Dernière édition par no_way le Mar 8 Aoû 2017 - 19:36, édité 1 fois


avatar

no_way
Aidactif
Aidactif

Messages : 1952
Inscrit(e) le : 26/03/2010

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

Résolu Re: Certains codes javascript ne fonctionnent plus

Message par Hyarmentir le Mar 8 Aoû 2017 - 19:35

Un grand merci à tous pour vos réponses Very Happy

Effectivement, avec :active j'avais déjà essayé dans tous les sens et cela ne s'applique que lorsque le clic est enfoncé pour disparaitre la demi-seconde après.

Merci beaucoup pour le code aussi, j'avais complètement oublié la function ! Du coup, j'ai modifié le bodyObj négligé par mes neurones et effectivement celà fonctionne bel et bien ! (:
Malheureusement, je retrouve le même problème avec d'autres codes et cela n'englobe qu'un seul élément à la fois. Je devrais passer par une autre méthode mais elle empêche malheureusement l'utilisateur de modifier l'URL à sa guise.
J'irais donc vers une autre apparence.

Ce sujet peut être fermé du coup puisqu'il ne concerne plus un problème de Javascript ne s'affichant pas (juste mon incompétence en JS....)

Encore merci et bonne journée (:
avatar

Hyarmentir
Nouveau membre

Messages : 11
Inscrit(e) le : 08/08/2017

http://thetta-reddast.forumactif.com
Hyarmentir a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Certains codes javascript ne fonctionnent plus

Message par no_way le Mar 8 Aoû 2017 - 19:39

Si votre problème est réglé, il vous faut marquer votre sujet en résolu Wink

Bonne continuation.


avatar

no_way
Aidactif
Aidactif

Messages : 1952
Inscrit(e) le : 26/03/2010

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

Résolu Re: Certains codes javascript ne fonctionnent plus

Message par Hyarmentir le Mar 8 Aoû 2017 - 19:42

C'était bien le cas, j'avais cocher la box, mes excuses si ça n'a pas pris, je recommence (:
avatar

Hyarmentir
Nouveau membre

Messages : 11
Inscrit(e) le : 08/08/2017

http://thetta-reddast.forumactif.com
Hyarmentir a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Certains codes javascript ne fonctionnent plus

Message par no_way le Mar 8 Aoû 2017 - 19:43

Il n'y a pas de mal bonne soirée !


avatar

no_way
Aidactif
Aidactif

Messages : 1952
Inscrit(e) le : 26/03/2010

no_way 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