ios focus with next / prev button
goetsu opened this issue · comments
sur ios après activation des boutons next / prev le focus reste sur le bouton au lieu d'aller sur le contenu mis à jour. A mon avis c'est encore le bug de gestion du focus qui est en cause. Je suppose qu'il faut donc ajouter le setTimeout 0 pour que cela fonctionne
Okay, je vais voir pour la fixer dès que possible ^^ (ça fait partie de nombreux tirs de modifs que je dois faire 👍 )
Merci bien ;)
Bon,
je viens d'envoyer sur la page de présentation un fix sur les boutons prev/next
http://a11y.nicolas-hoffmann.net/carrousel/
ça roule ?
Si c'est okay, j'envoie sur tous les focus du script.
Tu as pas dû pusher, le dernier commit date de 12 jours
@goetsu voilà c'est envoyé, j'ai pas eu le temps hier, mep en urgence, toussa... :)
Merci :)
J'en profité pour réindenter un peu le tout. Donc la règle => dès qu'il y a un $().focus => settimeout à 0 pour éviter ces bugs ?
bizarre ça semble pas corriger le bug qd je test sur http://a11y.nicolas-hoffmann.net/carrousel/, tu peux essayer de mettre le settimeout à 1000 ?
Yop, je viens de le remodifier http://a11y.nicolas-hoffmann.net/carrousel/
Yop @goetsu tu as pu re-essayer ?
vraiment bizarre ça fonctionne pour l'affichage de la last update du 9 mai mais pas l'autre sur ipad air et ipad mini 2 avec ios 8.3 et pas du tout sur iphone 6 ios 8.3.
Peut-être que si je mets le setimeout que sur les boutons next/prev, ça irait ?
en tester un peu plus sur iphone 6 ça fonctionne comme sur les autres en mode paysage et pas en mode portrait
doit y avoir un truc coté css qu'il aime pas, pour confirmer faudrait que tu mette à jour ton sample.html que je suis tester le truc en local là il fonctionne pas
Je viens de le mettre à jour ^^
il me semble qu'il y a un truc étrange. Quand je rajoute un alert dans la function qui déclenche le déplacement du focus :
$parent.find( ".carrousel__container div").one(
"webkitTransitionEnd MSTransitionEnd oTransitionEnd transitionend webkitAnimationEnd oAnimationEnd msAnimationEnd animationend",
function() {
$(this).data("transitioning", false); // Transition has ended.
setTimeout(function(){ alert('toto');$tab_linked.children($carrousel_hx_final).focus(); }, 2000);
}
);
}
il me déclenche 4 fois l'alerte alors que si je comprend bien il devrait le déclencher une seule fois.
Je sais pas si le bug vient de là mais on sait jamais
Le "fois 4" est dû au fait que je dois écouter toutes les transitions, y compris les préfixées. (enfin, je pense que ça vient de ça)
Du coup, j'avais résolu le problème avec le .one (qui n'exécute qu'une fois), mais apparemment, c'est pas encore ça... :-\
en fait je pense tu peux virer tout cela et laisser juste :
setTimeout(function(){ $tab_linked.children($carrousel_hx_final).focus(); }, 1000);
puisqu'il y a le settimeout à 1000 et que c'est la durée de ton animation. De plus, cela permettra également de déclencher le déplacement lors du clic sur les onglets. En faisant ça de mon coté ça fonctionne bien sauf pour le 1er onglet ou quand prev / next ramène au 1er mais j'ai pas encore trouvé pourquoi
la bonne nouvelle c'est que j'ai trouvé d'où vient le bug, la mauvaise c'est que c'est lié au css.
Il faut enlever la class invisible sur les hx ajouté automatiquement et enlever le display inline-block sur .slide .carrousel__content