JS ou Css transition de diapositive de page entre 2 pages complètes
J'ai deux pages html: Page1.html, Page2.html. Je voudrais glisser entre les deux pages. J'ai trouvé beaucoup de plugins et de solutions pour glisser entre deux divs ou dans un conteneur, mais ce dont j'ai besoin, c'est d'un changement de page complet.
J'ai trouvé quelque chose mais le problème est que le code jQuery sur page2 ne se déclenche pas lorsque la page est chargée. Je pourrais utiliser jQuery mobile, mais mon projet utilise jQuery ui et cela me donne des conflits ... il me faut donc autre chose.
Le projet est supposé fonctionner sur iPad, alors ce serait bien d'avoir des pages glissantes que vous pouvez faire glisser. Mais je serais heureux de simplement trouver un plugin pour la diapositive.
Je vous remercie.
Vous avez peu de solutions, comme utiliser Ajax pour ajouter du contenu à de "nouvelles pages" et ajouter un effet de glissement avec jQuery. Il y a quelques sujets à ce sujet sur Stack Overflow:
glisse entre les pages avec jQuery
Indices de glissement entre les pages
Ou ajoutez simplement un effet sur une page prête comme dans cet exemple:
<html>
<head>
<script src="js/jquery-1.7.2.min.js"></script>
<script>
$(document).ready(function(){
$('body div').slideDown();
});
</script>
</head>
<body>
<div style="width: 400px; height: 400px; background-color: blue; display: none;">
<a href="page2.htm" style="color: white;">PAGE 2>></a>
</div>
</body>
<html>
<head>
<script src="js/jquery-1.7.2.min.js"></script>
<script>
$(document).ready(function(){
$('body div').slideDown();
});
</script>
</head>
<body>
<div style="width: 400px; height: 400px; background-color: red; display: none;">
<a href="page1.htm" style="color: white;">PAGE 1>></a>
</div>
</body>
Bonne chance!
Je recherchais une transition de page complète par rapport à de nombreux exemples montrant une page avec deux DIV. J'ai trouvé que Animate.css fait très bien l'affaire.
