2010-09-15 6 views

Répondre

2

Webkit (Chrome, Safari) prend en charge HTML5 et CSS3. jQuery est pris en charge, mais vous risquez de trouver des animations un peu léthargiques. Webkit peut être trouvé sur Android et iOS. Opera Mini prend en charge HTML5 et CSS3, et je suis prêt à parier que sa performance Javascript est dans le même quartier que Webkit. Notez que Webkit et Opera ne supportent pas exactement les mêmes fonctionnalités - webkit a un peu plus de CSS de présentation disponible, mais pour la plupart ils ont des fonctionnalités similaires disponibles.

Bottom line: Gardez votre javascript maigre et propre, et gardez votre HTML et CSS limité à ce qui fonctionnerait normalement entre Webkit et Opera (et dans une moindre mesure, Firefox). De cette façon, vous serez assuré de développer une application compatible multi-plateforme qui ne gêne pas le téléphone.

Envisagez également d'utiliser media queries pour cibler des plates-formes spécifiques en CSS.

Edit: En ce qui concerne Hover/mouseenter/mouseLeave:

J'éviter d'utiliser mouseneter, vol stationnaire ou effets mouseLeave dans une application tactile. Ces effets sont conçus pour fournir un feedback pour un pointeur de souris, qui n'est pas directement attaché à notre bras (et considérant que les souris peuvent avoir des taux de suivi différents, il n'est pas toujours facile pour l'utilisateur de repérer la souris). Cependant, dans un environnement tactile, ces événements peuvent être déclenchés de manière incorrecte ou pas du tout. Certains navigateurs dans un environnement mobile (tel que Safari sur mon iPad) semblent appliquer l'état hover (voir here) en cliquant sur un lien, ce qui semble quelque peu incorrect.

Je travaille avec un écran tactile sur un PC Windows pour une application contenue, et cela présente des problèmes similaires. Lorsque les utilisateurs tapent sur le panneau, le curseur de la souris est déplacé à ce point - et ainsi des choses comme les titres peuvent apparaître sur les éléments qui en ont. Ce qui est stupide quand il n'y a pas de curseur là-bas. (La plupart des gens ne pensent pas à un curseur invisible qui les suit, ce qui est précisément ce qui se passe sur la plupart des écrans tactiles). Considérez qu'une application tactile est conçue pour imiter des boutons matériels physiques comme ceux d'un clavier. Vous n'obtenez aucun feedback que vous êtes sur le point de les pousser, mais vous obtenez un retour lorsque vous avez appuyé sur le bouton (retour physique/haptique) ainsi que le résultat souhaité. Étant donné que la plupart des écrans tactiles ne prennent pas en charge la rétroaction haptique, vous devez fournir une rétroaction visuelle pour remplacer les commentaires physiques attendus par les utilisateurs - et le résultat doit être déclenché. Par exemple, mes boutons dans mon application web changeront leur arrière-plan en un gradient inverse sur l'état "actif". Ce qui signifie lorsque le bouton est enfoncé, le bouton enfonce, puis l'action qui y est liée commencera.

+0

Est-ce que jquery hover/mouseenter/mouseleave fonctionnera sur un navigateur mobile avec une fonction "tactile"? et qu'en est-il de Blackberry, un site html 5, css3, jquery travaillera-t-il là-dessus? –

+0

Je n'ai pas de BlackBerry, donc je ne peux pas répondre à ça. En ce qui concerne les états hover, je mettrai à jour ma réponse. – EvilChookie

0

jQuery est juste javascript, donc tous. Des parties de HTML5 fonctionnent aussi bien que dans le navigateur de bureau. CSS3 Je ne peux pas commenter maintenant.

Questions connexes