Bonjour,

Avec javascript (et à plus forte raison jQuery), tu peux faire a peu pret
toutes les manipulations que tu veux avec le dom. Déplacer des éléments,
les insérer dans d'autres, etc.
Si ton balisage porte suffisamment d'information (par exemple avec des
class (ou des attributs data-*) question, reponse conteneur - qui contient
la question est ta réponse) tu peux reconstruire ce dont tu as besoin.

Cordialement,

*Cyril FABBY*
*
*
*Ingénieur d'étude, **Expert Accessiweb 2.0 en Evaluation de page, **Ergonomie,
Web Design*
*
*
*Key Consulting <http://keyconsulting.fr>*
41 rue Emile Duclaux
92150 Suresnes
Tél: 01 41 38 90 40
Fax: 01 41 38 90 41
P *Avant d'imprimer cet email, réfléchissez à l'impact sur l'environnement,
merci*


Le 30 octobre 2013 09:23, Antoine Bouet <[email protected]> a écrit :

>  Merci Steven pour ta réponse.
>
> Mais dans le cas où on veut que ce soit le clic sur la question qui ouvre
> la réponse, tu mets le contenu de la question dans ton bouton affichant le
> bloc caché ?
> Visuellement, il va falloir négocier avec les intégrateurs et le chef de
> projet si je mets un bouton ;)
>
>
>
> Cordialement,
>
> Antoine Bouet
> Ingénieur Développement
>
> CIMEOS
> Montbéliard - Besançon - Paris
>
> e-mail : [email protected]
> tel. : +33(0)9 72 30 72 42
>
> www.cimeos.com
>
> COORDONNEES DU SUPPORT :
> Hébergement et Nom de Domaine : [email protected] / 0899 49 42 00
> (1.34€/appel puis 0.34/min)
> Maintenance des sites : [email protected]
>  Le 25/10/2013 10:42, Steven Mouret a écrit :
>
>     Bonjour Antoine,
>
>  Voici comment je procède :
>
>  J'ajoute en JS une class js sur le body, cela me permet de savoir quand
> JS est activé. Utile en CSS pour mettre en forme seulement quand JS est
> activé.
>
>  Ensuite je ne cache aucune information en CSS, si JS est désactivé toutes
> les infos sont lisibles.
>
>  Je cache avec CSS les réponses aux questions en utilisant ma class js,
> un display: none peut être utilisé.
>
> En JS j'ajoute un button (pas un a, c'est une action sur la page et non un
> hyperlien) avant l'élément à afficher.
>
>  Sur l'action du bouton j'affiche mon bloc caché. Il me semble qu'il n'est
> pas nécessaire de renvoyer le focus dans le bloc s'il est juste après.
>
>  Voilà pas besoin de Noscript.
>
>  Il est possible de le faire en HTLM5 + ARIA aussi mais le support n'est
> pas forcément parfait.
>
>
> --
> Steven Mouret
>
>
> Le 25 octobre 2013 09:57, Antoine Bouet <[email protected]> a
> écrit :
>
>>  Bonjour la liste,
>>
>> J'ai une question concernant le fait de rendre un bon vieux toggle JQeury
>> accessible, notamment pour un cas très concret de réponses de FAQ qui se
>> déplie au clic sur chaque question.
>>
>> J'ai deux techniques et je me demande si les deux vont, si une seule est
>> bonne ou si ... aucune ne l'est !
>> 1) Masquer les réponses au chargement de la page via le document.ready de
>> JQuery.
>>
>> 2) Masquer les réponses en CSS, JQuery ne gère que le toggle, mettre une
>> balise noscript contenant une balise style forcant l'affichage des réponses
>> (!important).
>>
>> Dans les deux cas, si le JS est désactivé, on voit toutes les réponses
>> dépliées au chargement.
>> Mais est ce que tous les critères d'accessibilité sont respectés ?
>>
>> Merci à vous !
>>
>>  --
>>
>> Cordialement,
>>
>> Antoine Bouet
>> Ingénieur Développement
>>
>> CIMEOS
>> Montbéliard - Besançon - Paris
>>
>> e-mail : [email protected]
>> tel. : +33(0)9 72 30 72 42 <%2B33%280%299%2072%2030%2072%2042>
>>
>> www.cimeos.com
>>
>> COORDONNEES DU SUPPORT :
>> Hébergement et Nom de Domaine : [email protected] / 0899 49 42 
>> 00(1.34€/appel puis 0.34/min)
>> Maintenance des sites : [email protected]
>>
>> _______________________________________________
>> liste_gta mailing list
>> [email protected]
>> http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org
>>
>>
>
>
> _______________________________________________
> liste_gta mailing 
> [email protected]http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org
>
>
>
> _______________________________________________
> liste_gta mailing list
> [email protected]
> http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org
>
>
_______________________________________________
liste_gta mailing list
[email protected]
http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org

Répondre à