Quiero crear una aplicación web (para evitar tener que programar individualmente para iPhone, Android, BB, etc.) y estoy buscando un efecto de deslizamiento. ¿Hay un código HTML5 o de webkit que diga simplemente "pasar a la página siguiente/anterior"? (Sé que sería un código más detallado que eso, pero esa es la esencia de lo que quiero)Deslizar entre páginas web para una aplicación web
puede usar div para deslizar alrededor pero no toda la página en el navegador web.i, e solo puede cargar páginas en un Div después del deslizamiento afecta y no mueve toda la página.
funciona solo en cromo, safari.
aquí hay un código si usa jquery mobile.
$('body').live('swipeleft swiperight',function(event){
if (event.type == "swiperight") {
alert("swipped right side");
}
if (event.type == "swipeleft") {
alert("swipped left side");
}
event.preventDefault();
});
se refieren más aquí swipe detection
@sree me consiguió la mayor parte del camino, pero aquí está el código que terminé usando
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>jQuery Mobile: Demos and Documentation</title>
<link rel="stylesheet" href="css/themes/default/jquery.mobile-1.1.0.css" />
<link rel="stylesheet" href="docs/_assets/css/jqm-docs.css" />
<script src="js/jquery.js"></script>
<script src="docs/_assets/js/jqm-docs.js"></script>
<script src="js/jquery.mobile-1.1.0.js"></script>
</head>
<body>
<p>random page to test on</p>
<p>Swipe1 </p>
<script type="text/javascript">
$('body').live('swipeleft swiperight',function(event){
if (event.type == "swiperight") {
jQuery.mobile.changePage("page2.html",{transition:'slide'});
}
if (event.type == "swipeleft") {
jQuery.mobile.changePage("page1.html",{transition:'slide'});
}
event.preventDefault();
});
</script>
</body>
</html>
... y he descargado el jquery mobile kit y se mantiene los archivos CSS/JS con la misma estructura de archivos
Hice https://github.com/caktux/swipy solo para esto. Me gustaría recibir comentarios de otros desarrolladores y quizás convertirlos en el complemento de "sitios web receptivos como aplicaciones web" si hay interés.
Gracias @sree, esto parece prometedor, pero ¿hay alguna manera de hacer un enlace div a una página HTML diferente? Realmente no quiero tener todo el contenido en una página HTML, y prefiero deslizarme de las páginas. Así que básicamente
puedes cargar deslizando las páginas dentro de un div, el efecto seguirá siendo el mismo que el de deslizar, en lugar de alerta escribe este código $ ('# result'). Load ('page1.html'); – sree
Los gatitos deben amarte ... – DGund