comment faire defiler mes news ?

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : comment faire defiler mes news ?

wydook

Bonjour.

Je veut faire défiler les titres de mes dernieres news sur une ligne de droite à gauche mais je n'y arrive pas pour l'instant.
J'ai essayer un script javascript en y inserant mon code php pour récuperer les 5 dernieres news dans ma base mysql mais ca ne fontionne pas.

Quelqu'un aurait il une solution ?

Merci

Ps voici le script que j'ai essayer en y inserant mon code php qui me permet de récuperer les news

Code :

<script language="JavaScript1.2">
// personnalisez ici ***********
var marqueewidth=150
var marqueeheight=100
var speed=2
var marqueecontents='
<?php
mysql_connect('', '', ''); // Connexion à MySQL
mysql_select_db("" ); // Sélection de la base coursphp
$reponse = mysql_query("SELECT date FROM suivi ORDER BY date DESC LIMIT 0,1" ); // Requête SQL
// On fait une boucle pour lister tout ce que contient la table :
while ($data = mysql_fetch_array($reponse) )
{
// on décompose la date
sscanf($data['date'], "%4s-%2s-%2s %2s:%2s:%2s", $an, $mois, $jour, $heure, $min, $sec);
?>
<? echo '' , $jour , '/' , $mois , ' à ' , $heure , ':' , $min , '' ; ?> )
<?php
}
mysql_close(); // Déconnexion de MySQL
?>
'
//*****************************
var currentspeed=speed
if (document.all) document.write('<marquee onmouseover="stop()" onmouseout="start()" direction="up" scrollAmount='+currentspeed+' style="width: '+marqueewidth+'px; height: '+marqueeheight+'px">'+marqueecontents+'</marquee>')
function start()
{
currentspeed=speed
}
function stop()
{
currentspeed=0
}
</script>

Message édité par wydook le 23-03-2006 à 12:45:52

---------------
Toute l'actualité météo en continu http://www.meteo-world.com

Publicité

MS-DOS_1991

www.newbie-project.net

Bonjour

Deux choses:

1. Ton code est une usine à gaz :fou:

<script type="text/javascript"> et non <script language="JavaScript x.x">
Met donc des points-virgules à la fin de tes déclarations JavaScript
Code :
mysql_connect('', '', ''); // Connexion à MySQL
mysql_select_db("" ); // Sélection de la base coursphp
euh... j'espère que dans ton script tu remplit vraiment les valeurs
Code :
<?php
...
?>
<? echo '' , $jour , '/' , $mois , ' à ' , $heure , ':' , $min , '' ; ?> )
<?php
...
... Pourquoi doubler tes balises php

2. La balise marquée est dépréciée obsolète et dépréciée par le W3C (principalement pour des raisons d'accessibilité)

Message édité par MS-DOS_1991 le 25-03-2006 à 22:42:05

---------------
Viendez sur le Newbie-Project et essayez le Newbie-Directory (nouveau)

nargy

J ai un défileur de new rss avec deux boutons de vitesse de défilement:

Code :

<span id='st' style="white-space:pre;font-family:monospace;"></span>
<SCRIPT language="JavaScript" type="text/javascript">
<!--
var mtt_db = (document.compatMode && document.compatMode != 'BackCompat')? document.documentElement : document.body? document.body : null,
mtt_n = navigator.userAgent.toLowerCase(),
mtt_op = !!(window.opera && document.getElementById),
mtt_ie = mtt_n.indexOf('msie') != -1 && document.all && mtt_db && !mtt_op,
mtt_n4 = (document.layers && typeof document.classes != "undefined" );
var tiptext='INSERT TEXT HERE'; // texte à faire défiler
var tiptextx=Math.random()*tiptext.length;
var tiptextl=50; // longueure en caractères
var tiptextdir=1;
function GetById(t_id)
{
return (
mtt_n4? (document.layers[t_id] || null)
: mtt_ie? (document.all[t_id] || null)
: (document.getElementById(t_id) || null)
);
}
function movetext()
{
var st=GetById('st');
if (!st) return;
var str='';
var i;
var l=0;
if (tiptextx<tiptextl)
{
for(i=0;i<tiptextl-tiptextx;i++,l++) str+=' ';
var s=tiptext.substr(0, tiptextx);
str+=s;
l+=s.length;
}
else
{
str=tiptext.substr(tiptextx-tiptextl,tiptextl);
l+=str.length;
}
for(i=l;i<tiptextl;i++) str+=' ';
if (tiptextdir)
{
st.innerHTML='<pre style="margin:0px">'+str+'<'+'/pre>';
tiptextx=(tiptextx+tiptextdir)%(tiptext.length+tiptextl);
if (tiptextx<0) tiptextx+=tiptext.length+tiptextl;
tiptextx=(tiptextx)%(tiptext.length+tiptextl);
}
setTimeout('movetext();',150);
}
document.write(' <INPUT style="font-size:xx-small;" type=button value="<" onclick="javascript:tiptextdir=tiptextdir>0?0:tiptextdir-1;"><INPUT style="font-size:xx-small;" type=button value=">" onclick="javascript:tiptextdir=tiptextdir<0?0:tiptextdir+1;">');
movetext();
// -->
</SCRIPT>

Message cité 1 fois

gatsu35

Blablaté par Harko

Vous n'avez pas plus pourri comme script [:petrus dei]

nargy

c est sûr c est un vieux script, tu peut en faire un avec un div scrollant dans un div overflow:hidden. je suis preneur

gatsu35

Blablaté par Harko

J'en ai déjà fait pleins [:petrus75]
mais là j'en ai recodé un avec setInterval faudrait juste que je génère mieux la variable

gatsu35

Blablaté par Harko

Ah oui je rajouterai que moi je bosse sur un Div ou un autre élément de ce type par défaut, deplus il faut savoir les enfants que un élément en overflow:hidden ne peut être scrollé sous opera,
et ouais je sais, c'est le caca mais c'est comme ça

nargy

> un élément en overflow:hidden ne peut être scrollé sous opera
hein? heu........... c est pas lui qu il faut scroller, c est celui qui est à l intérieur, non? j utilise en général un scroll avec css:left, ça marche.

J ai posté un truc comme ça pour un mec qui essayait de faire une présentation en page glissantes. Ça marche du tonnerre: tu as des liens en bas de la page, quand tu clique dessus la page arrive en glissant par la droite ou la gauche et la page courante repart. Le tout avec des iframes (car taille fixe imposé) pour que ça marche avec des urls. Pas eu le temps encore de l améliorer pour taille dynamique, mais ça fonctionne avec FF+IE+Opera.

wydook

nargy a écrit :

J ai un défileur de new rss avec deux boutons de vitesse de défilement:

Code :

<span id='st' style="white-space:pre;font-family:monospace;"></span>
<SCRIPT language="JavaScript" type="text/javascript">
<!--
var mtt_db = (document.compatMode && document.compatMode != 'BackCompat')? document.documentElement : document.body? document.body : null,
mtt_n = navigator.userAgent.toLowerCase(),
mtt_op = !!(window.opera && document.getElementById),
mtt_ie = mtt_n.indexOf('msie') != -1 && document.all && mtt_db && !mtt_op,
mtt_n4 = (document.layers && typeof document.classes != "undefined" );
var tiptext='INSERT TEXT HERE'; // texte à faire défiler
var tiptextx=Math.random()*tiptext.length;
var tiptextl=50; // longueure en caractères
var tiptextdir=1;
function GetById(t_id)
{
return (
mtt_n4? (document.layers[t_id] || null)
: mtt_ie? (document.all[t_id] || null)
: (document.getElementById(t_id) || null)
);
}
function movetext()
{
var st=GetById('st');
if (!st) return;
var str='';
var i;
var l=0;
if (tiptextx<tiptextl)
{
for(i=0;i<tiptextl-tiptextx;i++,l++) str+=' ';
var s=tiptext.substr(0, tiptextx);
str+=s;
l+=s.length;
}
else
{
str=tiptext.substr(tiptextx-tiptextl,tiptextl);
l+=str.length;
}
for(i=l;i<tiptextl;i++) str+=' ';
if (tiptextdir)
{
st.innerHTML='<pre style="margin:0px">'+str+'<'+'/pre>';
tiptextx=(tiptextx+tiptextdir)%(tiptext.length+tiptextl);
if (tiptextx<0) tiptextx+=tiptext.length+tiptextl;
tiptextx=(tiptextx)%(tiptext.length+tiptextl);
}
setTimeout('movetext();',150);
}
document.write(' <INPUT style="font-size:xx-small;" type=button value="<" onclick="javascript:tiptextdir=tiptextdir>0?0:tiptextdir-1;"><INPUT style="font-size:xx-small;" type=button value=">" onclick="javascript:tiptextdir=tiptextdir<0?0:tiptextdir+1;">');
movetext();
// -->
</SCRIPT>

Dans:
var tiptext='INSERT TEXT HERE'; // texte à faire défiler

J ene peut pas mettre de requete sql, ca ne marche pas. J'ai aussi un flux rss, comment je doit proceder ?

---------------
Toute l'actualité météo en continu http://www.meteo-world.com

nargy

ben tu mets tout ça dans un fichier php, et:

Code :

var tiptext='<? echo addslashes("INSERT TEXT HERE" ) ?>';

Si tu le met dans un fichier à part, tu ajoute tout au début un header(Content-type...).

Publicité

gatsu35

Blablaté par Harko

nan nargy arrête de proposer ton script pourri stp, vous patientez une heure que j'ai fini le mien, et basta

nargy

:lol: ok moi je suis pas pressé

nargy

> nan nargy arrête de proposer ton script pourri stp, vous patientez une heure que j'ai fini le mien, et basta

ben j ai pas pu attendre finalement... je l ai pas encore testé avec IE, mais ça devrait être ok:

<script language="JavaScript" type="text/javascript">

</script>
<DIV style="background:pink;border:inset #efefef 5px;width:100%;overflow:hidden;" onmouseover="javascript:newsscrollerspeed=0;newsscrollerbgspeed=0;" onmouseout="javascript:newsscrollerspeed=newsscrollerspeed0;newsscrollerbgspeed=newsscrollerbgspeed0;" id="scroller">

</div>
<script language="JavaScript" type="text/javascript">

</script>

Message édité par nargy le 27-03-2006 à 12:39:32

gatsu35

Blablaté par Harko

c'est quoi ce caca [:petrus75] ??
ce soir 22H merci

nargy

ça marchre très bien!
si tu veut réorganiser le javascript tu peut toujours, mais chez moi c est nikel

nargy

par contre le post que j ai fait a foiré les " je vais corriger

gatsu35

Blablaté par Harko

putain je croyais avoir posté cet aprem un de mes script

aller je repost.

au passage moi je bosse par le DOM et fait scroller un DIV avec du texte au préalable mis dedans,
je fais pas un vieux caca en tableau et en trucs bizarres mal codé.
Ya 90% de ton code à jeter la dedans.
Ou peut etre qu'on a pas la même vision du scroll, tu fais défiler les message un à un avec attente [:petrus dei]
Faudra m'excuser que je ne sorte pas le script tout de suite, mais en ce moment c'est parti à 8h et rentré à 21h30 tous les soirs
quoi que je code dans le train mais je suis en train de debugger le bouzin afin qu'il soit DOM compliant et qui permette de gerer toutes les directions (top to bottom, bottom to top, left to right, right to left)

gatsu35

Blablaté par Harko

Ca par exemple c'est plus propre que ton bouzin qui fait des trucs de partout [:petrus75]
exmple ici : http://gatsu.ftp.free.fr/html/ScrollAuto.html

Code :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title></title>
    <script type="text/javascript">
      /*fonction d'initialisation du scroll sur un élément
         La fonctionne se lance ainsi :  
          initScroll(ElementId, increment, timer, direction)
          ElementId : correspond à l'identifiant de l'élément visé
          increment : nombre de pixels que le block avance
          timer : durée en millisecondes avant la prochaine incrémentation (avancement)
          direction : direction du bloc :  
                      -TB : Top to Bottom, du haut vers le bas
                      -BT : Bottom to Top, du bas vers le haut
                      -LR : Left to Right, de la gauche vers la droite
                      -RL : Right to Left, de la droite vers la gauche
        
          exemple :  
             -initScroll("monbloc", 2, 20, "tb" );
             -initScroll("mesnews", 1, 30, "lr" );
              
        
         la fonction scrollElement est la fonction qui est appelée successivement, pour faire avancer le scroll.
         la fonction initScroll sert à créer et initialiser le block avec qu'il puisse faire du scrolling.
         sous Opera, le scroll ne fonction que si les scroller sont visible (overflow:auto), avec overflow:hidden  
         le scroll ne fonctionnera pas sous Opera

         Vous pouvez à tout moment arrêter le scroll sur un bloc ou le relancer.
         il vous suffit pour cela de faire un clearInterval(lenomdemonblockTimer)
         le nom de la variable qui est lancée par setInterval, est constitué de l'id du bloc suivi du mot Timer
         ex : blocktoscrollTimer
         et vous pouvez à tout moment relancer la fonction par un setInterval de cette manière :  
         var monTimer = setInterval('scrollElement("iddemonElement", 10, "tb"', 30);
          
         la fonction scrollElement se lance avec les parametre ElementId, increment, direction.
          
         Attention aux valeurs que vous choisissez, dans l'increment, vous pouvre mettre des valeurs de 1 à 5, c'est largement suffisant
         et pour le timer, mettez des valeurs de 10 à 100, c'est une bonne fouchette
          
                  
       */  
      
      function initScroll(EltId, increment, timer, direction) {
         direction = direction.toLowerCase();
         var BlockScroll = document.getElementById(EltId); //On recupere l'element
          
         if (direction=="bt" || direction=="tb" ) {
            var FirstDiv = BlockScroll.insertBefore(document.createElement("div" ), BlockScroll.firstChild); //On cree un DIV au debut du bloc
            var LastDiv = BlockScroll.appendChild(document.createElement("div" )); //on cree un div à la fin du bloc
            
            FirstDiv.style.height = BlockScroll.clientHeight+"px"; //On dimensionne le premier div de la hauteur du bloc
            LastDiv.style.height = BlockScroll.clientHeight+"px"; //idem pour le dernier div
         }
         if (direction=="lr" || direction=="rl" ) {
            BlockScroll.style.paddingLeft=BlockScroll.clientWidth;
            BlockScroll.style.paddingRight=BlockScroll.clientWidth;
            BlockScroll.style.whiteSpace="nowrap"; //On vire le retour charriot afin de présenter le texte sur une seule ligne
          }
        eval('var '+EltId+'Timer = setInterval("scrollElement(\'"+ EltId + "\'," + increment + ",\'" + direction +"\')",timer);'); //On lance la fonction qui va initialiser le scroll
       }
        
       function scrollElement(eltId, increment, direction) {
          var BlockScroll = document.getElementById(eltId);
          with (BlockScroll) {
             switch(direction) {
                 case "bt":
                    scrollTop += increment;
                    if (scrollTop+clientHeight>=scrollHeight) { scrollTop=0};
                    break;
                 case "tb":
                    scrollTop -= increment;
                    if (scrollTop<=increment) { scrollTop=scrollHeight};
                    break;
                 case "rl":  
                    scrollLeft += increment;
                    if (scrollLeft+clientWidth>=scrollWidth) scrollLeft=0;
                    break;
                 case "lr":  
                    scrollLeft -= increment;
                    if (scrollLeft<increment) scrollLeft=scrollWidth;
                    break;
             }
              
          }
       }  
    
       window.onload=function() {
         initScroll("blocktoscroll", 3, 10, "bt" );
         initScroll("blocktoscroll2", 2, 10, "rl" );
       }
</script>
<style type="text/css">
        #blocktoscroll {
           overflow:hidden;
           width:100px;
           height:100px;
           border:1px solid red;
        }
        #blocktoscroll2 {
           overflow:hidden;
           width:100px;
           height:20px;
           border:1px solid blue;
        }
        
</style>
  </head>
  <body>
    <div id="blocktoscroll">
      Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam euismod
      nisl eu sapien. Ut pharetra pharetra ante. Morbi eleifend molestie urna.
      Donec tempor, orci eu semper aliquam, ipsum tortor tempor ante, id
      interdum justo nulla vel ipsum. Class aptent taciti sociosqu ad litora
      torquent per conubia nostra, per inceptos hymenaeos. Sed dictum, ipsum
      vitae malesuada interdum, nunc felis dignissim nibh, vitae varius massa
      tortor ut mauris. Quisque eget est. Sed vel erat. Vivamus vitae justo sit
      amet purus porttitor gravida. Phasellus ornare, massa non posuere
      feugiat, sem magna fringilla arcu, ut aliquam elit turpis id turpis.
      Etiam sodales placerat sem. Donec a odio. Donec porttitor pellentesque
      eros. Phasellus tellus. Donec nec mi. Pellentesque tincidunt gravida
      magna.
    </div>
    <div id="blocktoscroll2">
      Lorem ipsum dolor sit amet,  
    </div>
    
      </body>
</html>

Message édité par gatsu35 le 27-03-2006 à 23:44:28

gatsu35

Blablaté par Harko

J'espère que tu prendra exemple sur ce que j'ai fait. le but du jeu :

-tu as un élément HTML propre
-tu style ton élément à ta guise
-un javascript attaque l'élément, ajoute du style et des objets inside le bouzin, et lance une fonction qui s'occupe du scroll et baste.

C'est propre et comprehensible comme code.
ton truc à toi, c'est tellement mal codé que je ne prefère pas y fourrer mon nez. [:petrus75]

Au passage je vais le faire crossbrowser, car opera lui, a la mauvaise habitude (connard de opera ) de ne pas autoriser le scroll sur un élément en overflow:hidden, on ne peut gerer que si l'overflow est en auto.

alors la feinte, consiste à mettre un autre div dans le div parent, et ) cacher les scroller par le div parent en overflow, et mettre le div enfant en overflow:auto

putain je travaille trop le soir [:petrus75]

Message édité par gatsu35 le 28-03-2006 à 00:18:51

gatsu35

Blablaté par Harko

ah oui j'avoue que je ne prend pas en compte le background au niveau du scroll, mais est-ce vraiment utile [:petrus dei]

gatsu35

Blablaté par Harko

Aller V3 avec action sur les attributs et donc cela me permet d'ajouter une interaction avec la souris, du coup le bordel s'arrête lors du passage de la souris [:kbchris]
Exemple toujours au même endroit : http://gatsu.ftp.free.fr/html/ScrollAuto.html

Code :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title></title>
    <script type="text/javascript">
      /*fonction d'initialisation du scroll sur un élément
         La fonctionne se lance ainsi :  
          initScroll(ElementId, increment, timer, direction, ismouseover)
          ElementId : correspond à l'identifiant de l'élément visé
          increment : nombre de pixels que le block avance
          timer : durée en millisecondes avant la prochaine incrémentation (avancement)
          direction : direction du bloc :  
                      -TB : Top to Bottom, du haut vers le bas
                      -BT : Bottom to Top, du bas vers le haut
                      -LR : Left to Right, de la gauche vers la droite
                      -RL : Right to Left, de la droite vers la gauche
          ismouseover : arrêt du défilement lors du passage de la souris
                        true : action avec souris
                        false : aucune action avec souris
        
          exemple :  
             -initScroll("monbloc", 2, 20, "tb" );
             -initScroll("mesnews", 1, 30, "lr" );
              
        
         la fonction scrollElement est la fonction qui est appelée successivement, pour faire avancer le scroll.
         la fonction initScroll sert à créer et initialiser le block avec qu'il puisse faire du scrolling.
         sous Opera, le scroll ne fonction que si les scroller sont visible (overflow:auto), avec overflow:hidden  
         le scroll ne fonctionnera pas sous Opera

         Vous pouvez à tout moment arrêter le scroll sur un bloc ou le relancer.
         il vous suffit pour cela de faire un clearInterval(lenomdemonblockTimer)
         le nom de la variable qui est lancée par setInterval, est constitué de l'id du bloc suivi du mot Timer
         ex : blocktoscrollTimer
         et vous pouvez à tout moment relancer la fonction par un setInterval de cette manière :  
         var monTimer = setInterval('scrollElement("iddemonElement", 10, "tb"', 30);
          
         la fonction scrollElement se lance avec les parametre ElementId, increment, direction.
          
         Attention aux valeurs que vous choisissez, dans l'increment, vous pouvre mettre des valeurs de 1 à 5, c'est largement suffisant
         et pour le timer, mettez des valeurs de 10 à 100, c'est une bonne fouchette
          
                  
       */  
      
      function initScroll(EltId, increment, timer, direction, ismouseover) {
         direction = direction.toLowerCase();
         var BlockScroll = document.getElementById(EltId); //On recupere l'element
         //On rajoute les attributs dans l'élément, ça évite de se les trimballer à chaque fois
         BlockScroll.increment = increment;
         BlockScroll.timer = timer;
         BlockScroll.direction = direction;
         if (direction=="bt" || direction=="tb" ) { //direction verticale
            var FirstDiv = BlockScroll.insertBefore(document.createElement("div" ), BlockScroll.firstChild); //On cree un DIV au debut du bloc
            var LastDiv = BlockScroll.appendChild(document.createElement("div" )); //on cree un div à la fin du bloc
            FirstDiv.style.height = BlockScroll.clientHeight+"px"; //On dimensionne le premier div de la hauteur du bloc
            LastDiv.style.height = BlockScroll.clientHeight+"px"; //idem pour le dernier div
         }
         if (direction=="lr" || direction=="rl" ) { //direction horizontale
            BlockScroll.style.paddingLeft=BlockScroll.clientWidth;
            BlockScroll.style.paddingRight=BlockScroll.clientWidth;
            BlockScroll.style.whiteSpace="nowrap"; //On vire le retour charriot afin de présenter le texte sur une seule ligne
          }
       //Rajout des évènement sur le block
       if (ismouseover) {
          BlockScroll.onmouseover = function() { //Arrête le défilement lors du passage de la souris
             this.backupincrement = this.increment;
             this.increment=0;
          }
          BlockScroll.onmouseout = function() {
             this.increment=this.backupincrement;
          }
       }
       eval('var '+EltId+'Timer = setInterval("scrollElement('"+ EltId + "')",timer);'); //On lance la fonction qui va initialiser le scroll
        
        
        
       }
        
       function scrollElement(eltId) {
        
          var BlockScroll = document.getElementById(eltId);
          with (BlockScroll) {

             switch(direction) {
                 case "bt":
                    scrollTop += increment;
                    if (scrollTop+clientHeight>=scrollHeight) { scrollTop=0};
                    break;
                 case "tb":
                    scrollTop -= increment;
                    if (scrollTop<=increment) { scrollTop=scrollHeight};
                    break;
                 case "rl":  
                    scrollLeft += increment;
                    if (scrollLeft+clientWidth>=scrollWidth) scrollLeft=0;
                    break;
                 case "lr":  
                    scrollLeft -= increment;
                    if (scrollLeft<increment) scrollLeft=scrollWidth;
                    break;
             }
          }
       }  
    
       window.onload=function() {
         initScroll("blocktoscroll", 3, 50, "bt", true);
         initScroll("blocktoscroll2", 2, 10, "rl", false);
       }
</script>
<style type="text/css">
        #blocktoscroll {
           overflow:hidden;
           width:100px;
           height:100px;
           border:1px solid red;
        }
        #blocktoscroll2 {
           overflow:hidden;
           width:100px;
           height:20px;
           border:1px solid blue;
        }
        
</style>
  </head>
  <body>
    <div id="blocktoscroll">
      Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam euismod
      nisl eu sapien. Ut pharetra pharetra ante. Morbi eleifend molestie urna.
      Donec tempor, orci eu semper aliquam, ipsum tortor tempor ante, id
      interdum justo nulla vel ipsum. Class aptent taciti sociosqu ad litora
      torquent per conubia nostra, per inceptos hymenaeos. Sed dictum, ipsum
      vitae malesuada interdum, nunc felis dignissim nibh, vitae varius massa
      tortor ut mauris. Quisque eget est. Sed vel erat. Vivamus vitae justo sit
      amet purus porttitor gravida. Phasellus ornare, massa non posuere
      feugiat, sem magna fringilla arcu, ut aliquam elit turpis id turpis.
      Etiam sodales placerat sem. Donec a odio. Donec porttitor pellentesque
      eros. Phasellus tellus. Donec nec mi. Pellentesque tincidunt gravida
      magna.
    </div>
    <div id="blocktoscroll2">
      Lorem ipsum dolor sit amet,  
    </div>
    
      </body>
</html>

Message édité par gatsu35 le 28-03-2006 à 00:33:02

nargy

Citation :

D accord, mon script est un peu crade, mais bon, tu peut mettre le JS et le CSS à part.

> ah oui j'avoue que je ne prend pas en compte le background au niveau du scroll, mais est-ce vraiment utile [:petrus dei]

Le mien n a pas le choix du défilement vertical.

Mais il a en plus:
* Fait défiler une image de fond,
* Défilement horizontal cyclique,
* Arrête temporairement le défilement lorsque la souris passe au dessus (pour ne pas courrir après un lien),
* Rechargement de la page avec continuité du défilement possible.
* curseur en forme de flèche

Pour pouvoir faire un message cyclique:
mets les messages dans un tableau et fait scroller le tableau dans un div

Utilise deux fonction javascript pas tout à fait standard: innerWidth et innerHTML, mais compatibles FF+IE+Opera (le reste j ai pas testé).

définit deux fonctions javascript:
- newsscrollbounds()=vérifier que le scroll cyclique est dans les limites
- newsscroll()=scroller à l aide de CSS

Le reste du code est des initialisations au début de scroll, que je pourrait certe mettre dans une fonction à part.

bref, le source du mien est plus crade, mais il est plus joli a regarder! et toc!

Message cité 1 fois

nargy

Je l améliore encore:
+ pas besoin de scroller si les messages sont trop petits,
+ meilleur dimensionnement
+ laisser à l internaute le choix de la vitesse de défilement
+ JS/CSS à part et plus lisible

Message cité 1 fois

gatsu35

Blablaté par Harko

Recode tout et porte toi sur le JS via le DOM.

Et utilise les scrollTop, scrollLeft and Co.

Pour opera c'est juste une chtite question de temps mais il est 2h du mat là

gatsu35

Blablaté par Harko

nargy a écrit :

Je l améliore encore:
+ pas besoin de scroller si les messages sont trop petits,

Bon je retire ce que j'ai dit, ya pas deux lignes à rajouter, puisque c'est tout bonnement impossible
de détecter la taille du contenu à proprement parler
Faudrait que je regarde de plus près , mais par défaut, si un bloc est fait pour scroller, il scrollera .
Et puis si un bloc doit être scrollé, c'est que son contenu est trop grand pour rentrer dans bloc par defaut

nargy a écrit :

+ meilleur dimensionnement

>>Déjà fait

nargy a écrit :

+ laisser à l internaute le choix de la vitesse de défilement

un peu inutile mais c'est très simple à faire, quoi que si tu as déjà défini la vitesse de défilement, tu aura du mal à la redéfinir derrière. Humm ah si moi je peux les doigts dans le nez, étant donné que mon élément contient les attribut en lui même, j'ai juste soit à modifier l'incrément, soit à stopper l'élément, et à le relancer avec un nouveau timer cf fonction setInterval et eval

nargy a écrit :

+ JS/CSS à part et plus lisible

>>Déjà fait
Ben comme je t'ai dit, c'est comme ça qu'on fait du javascript, pas comme toi tu fais là.
Là ton script il est digne de figurer sur l'éditeurjavascript

[/quotemsg]

Message édité par gatsu35 le 28-03-2006 à 02:59:07

gatsu35

Blablaté par Harko

nargy a écrit :

Oui il est crade et je te l'ai dit plusieur fois. M'enfin, il est très moche à l'affichage, et je ne sais pas de quelle manière tu opère ton scroll, mais c'est d'une horreur pas possible, ca me bouffe mes scrollers sur ma page

nargy a écrit :

Le mien n a pas le choix du défilement vertical.

Ben il était concu pour ça au départ le mien

nargy a écrit :

Mais il a en plus:
* Fait défiler une image de fond,

gadget un peu inutile. J'ai juste à foutre une image en fond et baste background-attachment:scroll c'est fait pour , je te montrerai un exemple taleur

nargy a écrit :

* Défilement horizontal cyclique,

Cyclique ? plutôt bordelique nan ?

nargy a écrit :

* Arrête temporairement le défilement lorsque la souris passe au dessus (pour ne pas courrir après un lien),

Idem , ajouté à la mano sur les éléments eux même

nargy a écrit :

* Rechargement de la page avec continuité du défilement possible.

C'est quoi que tu appelle continuité ? reprise là ou il en était ?
humm ca me parapit plutot louche tout ça, car lors du rechargement de la page, comment fait tu pour récupérer l'état précédent du scroller ? en cookies ? Ca fait trop bloat, surtout que si tu enregistres le cookies toutes les 10 millisecondes imagines le pauvre PC du gars

nargy a écrit :

* curseur en forme de flèche

humm cursor: default; en CSS sur l'élément ça fait pareil [:petrus75]

nargy a écrit :

Pour pouvoir faire un message cyclique:
mets les messages dans un tableau et fait scroller le tableau dans un div

Queneni pas besoin, le webmaster n'a juste qu'à caser ses news dans une liste genre :
<ul>
<li>news 1 : voila la news</li>
<li>news 2: voila laseconde news </li>
<li>...</li>
</ul>
tout ceci dans le DIV qui sera scrollé, et automatiquement, sont truc sera splitté dans un tableau et défilera cycliquement, prévu dans la V4

nargy a écrit :

Utilise deux fonction javascript pas tout à fait standard: innerWidth et innerHTML, mais compatibles FF+IE+Opera (le reste j ai pas testé).

Ce ne sont pas des fonctions mais des attributs de l'objet en question [:aloy]

nargy a écrit :

définit deux fonctions javascript:
- newsscrollbounds()=vérifier que le scroll cyclique est dans les limites
- newsscroll()=scroller à l aide de CSS

Hhum ya trop de fonction je trouve, il devient bloatware ton truc et bordelique aussi

nargy a écrit :

Le reste du code est des initialisations au début de scroll, que je pourrait certe mettre dans une fonction à part.

bref, le source du mien est plus crade, mais il est plus joli a regarder! et toc!

vivi ton code est crade [:petrus75] je te le confirme et met une fonction à part, on ne met jamais de JS dans une page en brut sauvagement

Message édité par gatsu35 le 28-03-2006 à 02:31:22

nargy

Citation :

Wo non! la position de départ est fonction de l horloge du nagivateur, donc si tu recharge la page ça reprends là où c en était! hehehehe

Bon ok, ça ne marche plus quand le défileur est arrêté avec la souris, mais ça coûte rien de le mettre quand même.

Message édité par nargy le 28-03-2006 à 10:34:44

Publicité

FORUM HardWare.fr

Programmation

HTML/CSS

comment faire defiler mes news ?

Sujets relatifs
Module de gestion de news	Module news HTML
[ASP .NET] Page de news	Projet étudiant: Programme Affichage News et Popup
Comment voir l'heure à la seconde prete à laquelle une news est postée	roblème de positionnement de news, d'images avec float
Site d'asso : Ajout de news ...	Comment inclure une fonction "spoilers" dans un script de news
Une forme d'include pour les news....	Deux colonnes pour des news
Plus de sujets relatifs à : comment faire defiler mes news ?

Page générée en 0.096 secondes