Faire defiler des image a la molette ou souris
Soyez le premier à donner votre avis sur cette source.
Vue 14 403 fois - Téléchargée 1 601 fois
Description
il s'agit de faire defiler des images qui se trouve dans un tableau.
j'ai mis deux sources qui font la meme chose sauf que l'une le fait a la souris et l'autre a la molette
les script sont courts mais efficaces
fonctionne sur opera FF chrome et IE pour la souris a partir de IE 5.5 et pour la molette IE 6
++
courts mais efficace
j'ai mis deux sources qui font la meme chose sauf que l'une le fait a la souris et l'autre a la molette
les script sont courts mais efficaces
fonctionne sur opera FF chrome et IE pour la souris a partir de IE 5.5 et pour la molette IE 6
++
Source / Exemple :
<!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> <link rel="stylesheet" type="text/css" href="css/style.css" media="screen"> <script type="text/javascript"> function souris(s){ var dde=(navigator.vendor) ? document.documentElement.childNodes[1] : document.documentElement setX =((navigator.appName.substring(0,3)=="Mic") ? event.clientX : s.clientX) + dde.scrollLeft; setY =((navigator.appName.substring(0,3)=="Mic") ? event.clientY : s.clientY) + dde.scrollTop; return false } navigator.appName.substring(0,3)=="Net" ? document.addEventListener("mousemove", souris, false) : document.attachEvent('onmousemove',function(){souris(event)}); function sensa(){ var clic=document.getElementById('clic') var oml=(clic.offsetLeft+(clic.offsetWidth/2))-setX clic.scrollLeft=clic.scrollLeft-(oml/10); oxo=setTimeout(sensa,50) } function anul(){ clearTimeout(oxo) } </script> </head> <body> <div id="clic"> <table id="cloc"cellspacing=2 onmouseover='sensa()' onmouseout='anul()'> <tr> <td><img src='images\d1.jpg'> </td> <td><img src='images\d1_02.jpg'> </td> <td><img src='images\d1_03.jpg'> </td> <td><img src='images\d1_04.jpg'> </td> <td><img src='images\d1_05.jpg'> </td> <td><img src='images\d1_06.jpg'> </td> <td><img src='images\d2_02.jpg'> </td> <td><img src='images\d2_03.jpg'> </td> <td><img src='images\d2_04.jpg'> </td> <td><img src='images\d2_05.jpg'> </td> <td><img src='images\d2_06.jpg'> </td> <td><img src='images\d1.jpg'> </td> <td><img src='images\d1_02.jpg'> </td> <td><img src='images\d1_03.jpg'> </td> <td><img src='images\d1_04.jpg'> </td> <td><img src='images\d1_05.jpg'> </td> <td><img src='images\d1_06.jpg'> </td> <td><img src='images\d2_02.jpg'> </td> <td><img src='images\d2_03.jpg'> </td> <td><img src='images\d2_04.jpg'> </td> <td><img src='images\d2_05.jpg'> </td> <td><img src='images\d2_06.jpg'> </td> </tr> </table> </div> </body> </html>
Conclusion :
courts mais efficace
Codes Sources
A voir également
- Faire défiler des images javascript
- Faire défiler des images en boucle html - Meilleures réponses
- Faire défiler des images - Meilleures réponses
- Javascript : Images défilantes en javascript (scrolling images) - CodeS SourceS - Guide
- Javascript : Image défilante - CodeS SourceS - Guide
- Javascript : Defilement d'image par tableau - CodeS SourceS - Guide
- Popup image javascript - Guide
- Visual Basic / VB.NET : Texte défilement vertical + image en fond d'écran - CodeS Sour - Guide
7 nov. 2012 à 12:44
J'utilise avec la molette : la vitesse de défilement est un peu lente ou saccadée ( en jouant sur le pas de déplacement). En tout cas, très bon script !
2 juin 2011 à 14:03
Est-il possible d'avoir la même chose en vertical ?
Merci :)
6 mars 2011 à 19:49
Pour info si ce script fonctionne mal c'est tout simplement à cause des liens images
Si je prend le premier nous avons ça :
<td> </td>
Au lieu de :
<td> </td>
A+++
27 juil. 2010 à 22:21
27 juil. 2010 à 21:38
Vous n'êtes pas encore membre ?
inscrivez-vous, c'est gratuit et ça prend moins d'une minute !
Les membres obtiennent plus de réponses que les utilisateurs anonymes.
Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.
Le fait d'être membre vous permet d'avoir des options supplémentaires.