Rebonjour à toutes et à tous.
Bon, étant donné que mon topic sur la fonction onkeydown est résolue - encore merci à Gothor - je préfère en ouvrir un nouveau.
On reste cependant dans la fonction qui détecte et définie les touches pressées au clavier et leurs actions adjacentes :
J'ai réussi, pour toutes les fonctions Javascript dans ma page - quelles qu'elles soient - à les appeler via cette fonction des Events.
C'est donc exactement ce que je veux faire sur la toute dernière fonction JQuery qui reste à traiter dans ma page. Seulement voilà : sa structure est assez particulière et pour tout dire, je ne vois même pas son nom, sa définition établie, bref, elle m'échappe totalement.
Elle gère l'affichage/masquage d'une info-bulle au clic sur une image. Il ne reste plus qu'à naviguer dans le contenu de la bulle (3 mentions au choix en fait) pour choisir, au clic, ce que l'on veut.
Maintenant, j'ai bien réussi à mettre "un accesskey=une lettre" dans le <a href> du lien de chaque mention de l'info bulle. Et il fonctionne. Seulement il oblige à en passer par la combinaison de touches Mac ou Win + la lettre, pour ouvrir, choisir une mention et refermer l'infobulle.
Or j'ai un JQuery d'accessibilité dans la page qui permet de n'utiliser que les touches seules, sans les combinaisons tarabiscottées et contre-productives des systèmes et des navigateurs.
Ainsi dois-je appeler la fonction Javascript de l'info-bulle via la fonction JQuery des events(); pour pouvoir utiliser uniquement la lettre choisie afin de manipuler l'ouverture/fermeture de l'info bulle au clavier.
Voici donc le code complet de l'info-bulle :
Où "bubbleInfo" est la class CSS de la div qui encapsule les mentions (les css n'indiquent que les positions, les fonts, les couleurs, les images de bordures de la bulle, etc..). Si je n'ai pas essayé des dizaines de variantes, je n'en essayé aucune... Je reviens vers vous ici sur ce forum parce que là, vraiment, il faut me montrer et m'exliquer, car je n'arrive plus à rien du tout, seul...
Bref, sauriez-vous comment appeler cette fonction dans une nouvelle ligne du genre :
case : 70 mafonction(); break ????
Par avance, mille mercis pour votre aide.
Cordialement,
Neum
Modifié par Neum (16 Feb 2012 - 15:18)
Bon, étant donné que mon topic sur la fonction onkeydown est résolue - encore merci à Gothor - je préfère en ouvrir un nouveau.
On reste cependant dans la fonction qui détecte et définie les touches pressées au clavier et leurs actions adjacentes :
function maFonction(evt) {
e = evt || window.event;
switch (e.keyCode) {
case 86 : uneFonction(); break;
case 78 : uneAutreFonction(); break;
... etc ...
}
}
et dans la balise body : <body onkeydown="maFonction(event)">
J'ai réussi, pour toutes les fonctions Javascript dans ma page - quelles qu'elles soient - à les appeler via cette fonction des Events.
C'est donc exactement ce que je veux faire sur la toute dernière fonction JQuery qui reste à traiter dans ma page. Seulement voilà : sa structure est assez particulière et pour tout dire, je ne vois même pas son nom, sa définition établie, bref, elle m'échappe totalement.
Elle gère l'affichage/masquage d'une info-bulle au clic sur une image. Il ne reste plus qu'à naviguer dans le contenu de la bulle (3 mentions au choix en fait) pour choisir, au clic, ce que l'on veut.
Maintenant, j'ai bien réussi à mettre "un accesskey=une lettre" dans le <a href> du lien de chaque mention de l'info bulle. Et il fonctionne. Seulement il oblige à en passer par la combinaison de touches Mac ou Win + la lettre, pour ouvrir, choisir une mention et refermer l'infobulle.
Or j'ai un JQuery d'accessibilité dans la page qui permet de n'utiliser que les touches seules, sans les combinaisons tarabiscottées et contre-productives des systèmes et des navigateurs.
Ainsi dois-je appeler la fonction Javascript de l'info-bulle via la fonction JQuery des events(); pour pouvoir utiliser uniquement la lettre choisie afin de manipuler l'ouverture/fermeture de l'info bulle au clavier.
Voici donc le code complet de l'info-bulle :
$(function () {
$('.bubbleInfo').each(function () {
var distance = 30;
var time = 10;
var hideDelay = 30000; ==> grand délai pour avoir le temps de choisir dans l'info-bulle
var hideDelayTimer = null;
var beingShown = false;
var shown = false;
var trigger = $('.trigger', this);
var info = $('.popup', this).css('opacity', 0);
$([trigger.get(0), info.get(0)]).click(function () { ==> avant c'était "onmouseover" / j'ai mis "click"
if (hideDelayTimer) clearTimeout(hideDelayTimer);
if (beingShown || shown) {
// don't trigger the animation again
return;
} else {
// reset position of info box
beingShown = true;
info.css({
top: 100,
left: 22,
display: 'block'
}).animate({
top: '-=' + distance + 'px',
opacity: 0.7
}, time, 'swing', function() {
beingShown = false;
shown = true;
});
}
return false;
}).mouseout(function () {
if (hideDelayTimer) clearTimeout(hideDelayTimer);
hideDelayTimer = setTimeout(function () {
hideDelayTimer = null;
info.animate({
top: '-=' + distance + 'px',
opacity: 0
}, time, 'swing', function () {
shown = false;
info.css('display', 'none');
});
}, hideDelay);
return false;
});
});
});
Où "bubbleInfo" est la class CSS de la div qui encapsule les mentions (les css n'indiquent que les positions, les fonts, les couleurs, les images de bordures de la bulle, etc..). Si je n'ai pas essayé des dizaines de variantes, je n'en essayé aucune... Je reviens vers vous ici sur ce forum parce que là, vraiment, il faut me montrer et m'exliquer, car je n'arrive plus à rien du tout, seul...
Bref, sauriez-vous comment appeler cette fonction dans une nouvelle ligne du genre :
case : 70 mafonction(); break ????
Par avance, mille mercis pour votre aide.
Cordialement,
Neum
Modifié par Neum (16 Feb 2012 - 15:18)