Scrolling dynamique type googlevideos
Fermé
niquedouille
-
30 janv. 2010 à 13:52
avion-f16 Messages postés 19250 Date d'inscription dimanche 17 février 2008 Statut Contributeur Dernière intervention 22 décembre 2024 - 2 févr. 2010 à 17:26
avion-f16 Messages postés 19250 Date d'inscription dimanche 17 février 2008 Statut Contributeur Dernière intervention 22 décembre 2024 - 2 févr. 2010 à 17:26
A voir également:
- Scrolling dynamique type googlevideos
- Tableau croisé dynamique - Guide
- Liste déroulante dynamique excel - Guide
- Clear type - Guide
- Liste déroulante dynamique en cascade excel - Guide
- Ip dynamique free ✓ - Forum Réseaux sociaux
5 réponses
avion-f16
Messages postés
19250
Date d'inscription
dimanche 17 février 2008
Statut
Contributeur
Dernière intervention
22 décembre 2024
4 505
30 janv. 2010 à 15:24
30 janv. 2010 à 15:24
Tu peux utiliser le plugin scrollTo pour JQuery
http://demos.flesler.com/jquery/scrollTo/
http://demos.flesler.com/jquery/scrollTo/
avion-f16
Messages postés
19250
Date d'inscription
dimanche 17 février 2008
Statut
Contributeur
Dernière intervention
22 décembre 2024
4 505
31 janv. 2010 à 16:57
31 janv. 2010 à 16:57
Non, c'est gratuit.
bonjour,
effectivement, c'est gratuit :)
Bon cela fait 2 jours que j'essaye de le faire fonctionner, mais sans succès. La documentation n'est pas des plus claire, du moins pour moi. Je n'arrive pas à trouver d'explication claire, quelqu'un saurait-il m'aider ?
Page test : http://www.jbbourgeois.com/test.php
voici mon code (simplifié pour page de test) :
TEST.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
<script src="functions.js" type="text/javascript"></script>
<script type="text/javascript" src="include/jquery-1.3.1.min.js"></script>
<script type="text/javascript" src="include/jquery.scrollTo.js"></script>
<script type="text/javascript" src="include/jquery.scrollTo-min.js"></script>
<script type="text/javascript">
function scroll(){
$('#conteneur').scrollTo( '+=150px' );
}
</script>
<style type="text/css">
<!--
#conteneur {
background-color: #09C;
height: 100px;
width: 70px;
}
-->a
</style>
</head>
<body><a href="#" onclick="scroll()" >clic to scroll</a>
<iframe id="conteneur" src="testiframe.php" scrolling="no" frameborder="0"></iframe>
</body>
</html>
TESTIFRAME.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
<style type="text/css">
<!--
ul {
margin: 0px;
padding: 0px;
}
-->
</style>
</head>
<body>
<ul>
<li>ligne1</li>
<li>ligne2</li>
<li>ligne3</li>
<li>ligne4</li>
<li>ligne5</li>
<li>ligne6</li>
<li>ligne7</li>
<li>ligne8</li>
<li>ligne9</li>
<li>ligne10</li>
<li>ligne11</li>
<li>ligne12</li>
<li>ligne13</li>
<li>ligne14</li>
<li>ligne15</li>
<li>ligne16</li>
<li>ligne17</li>
<li>ligne18</li>
<li>ligne19</li>
<li>ligne20</li>
</ul>
</body>
</html>
Au passage, j'utilise une ifrmae parce que je n'ai pas réussit à le faire fonctionner dans une balise div..
effectivement, c'est gratuit :)
Bon cela fait 2 jours que j'essaye de le faire fonctionner, mais sans succès. La documentation n'est pas des plus claire, du moins pour moi. Je n'arrive pas à trouver d'explication claire, quelqu'un saurait-il m'aider ?
Page test : http://www.jbbourgeois.com/test.php
voici mon code (simplifié pour page de test) :
TEST.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
<script src="functions.js" type="text/javascript"></script>
<script type="text/javascript" src="include/jquery-1.3.1.min.js"></script>
<script type="text/javascript" src="include/jquery.scrollTo.js"></script>
<script type="text/javascript" src="include/jquery.scrollTo-min.js"></script>
<script type="text/javascript">
function scroll(){
$('#conteneur').scrollTo( '+=150px' );
}
</script>
<style type="text/css">
<!--
#conteneur {
background-color: #09C;
height: 100px;
width: 70px;
}
-->a
</style>
</head>
<body><a href="#" onclick="scroll()" >clic to scroll</a>
<iframe id="conteneur" src="testiframe.php" scrolling="no" frameborder="0"></iframe>
</body>
</html>
TESTIFRAME.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
<style type="text/css">
<!--
ul {
margin: 0px;
padding: 0px;
}
-->
</style>
</head>
<body>
<ul>
<li>ligne1</li>
<li>ligne2</li>
<li>ligne3</li>
<li>ligne4</li>
<li>ligne5</li>
<li>ligne6</li>
<li>ligne7</li>
<li>ligne8</li>
<li>ligne9</li>
<li>ligne10</li>
<li>ligne11</li>
<li>ligne12</li>
<li>ligne13</li>
<li>ligne14</li>
<li>ligne15</li>
<li>ligne16</li>
<li>ligne17</li>
<li>ligne18</li>
<li>ligne19</li>
<li>ligne20</li>
</ul>
</body>
</html>
Au passage, j'utilise une ifrmae parce que je n'ai pas réussit à le faire fonctionner dans une balise div..
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
avion-f16
Messages postés
19250
Date d'inscription
dimanche 17 février 2008
Statut
Contributeur
Dernière intervention
22 décembre 2024
4 505
2 févr. 2010 à 17:26
2 févr. 2010 à 17:26
srollTo() est une méthode déjà dans Javascript sur certains objets.
Il faut donc l'appeler sur l'objet qui n'a pas cette méthode par défaut (sauf maintenant avec le plugin) : JQuery
Il faut donc l'appeler sur l'objet qui n'a pas cette méthode par défaut (sauf maintenant avec le plugin) : JQuery
$.scrollTo( '#conteneur', 150);