Rechercher : dans
Par :

Defilement vertical

Dernière réponse le 25 jun 2008 à 19:51:07 amelie, le 25 jun 2008 à 12:00:33 
 Signaler ce message aux modérateurs

Bonjour,

J'essaie de realiser des news défilantes en javascript. Cependant, il faut que j'aille chercher mes news dans une base de donnée et que je n'affiche que le titre!
J'ai trouver un peu d'aide grâce à ce code mais le problème c'est que rien en défile.
Comment puis-je modifier ce code pour que cela defile verticalement?
Sinon comment je peux faire pour afficher le titre des news à partir de ma base de donnée et les faire défiler verticalement?
qulequ'un peut il m'aider svp?
Merci d'avance.

<?php
mysql_connect("localhost", "root", ""); mysql_select_db("cantin"); $retour = mysql_query('SELECT * FROM news'); $date_mel = date("Y-m-d ");
while ($donnees = mysql_fetch_array($retour))
{

?>
<a href="news1.html" target=" blank">

<script language="JavaScript">
var txt_defil_width = 400; //largeur
var txt_defil_height = 100; //hauteur
var txt_defil_bgcolor = '#000000'; //couleur de fond
var txt_defil_background = ""; //image de fond
var txt_defil_pause = 5000; //Temps en milliemes de secondes
var txt_defil_info = new Array;

txt_defil_info[0]='<a href="page1.htm" CLASS=txt_defil>lien1</a> texte 1';
txt_defil_info[1]='<a href="page2.htm" CLASS=txt_defil>lien2</a> texte 2';
txt_defil_info[2]='<a href="page3.htm" CLASS=txt_defil>lien3</a> texte 3';
txt_defil_info[3]='<iframe src="mon_iframe.htm" width="468" height="60" scrolling="no" frameborder="0"></iframe>';
</script>
<script language="JavaScript" src="textdefil2.js"></script>


<?php echo $donnees['TITRE'];? </a>

<?php
} // Fin de la boucle des news
?>

Configuration: Windows XP
Internet Explorer 7.0

Meilleures réponses pour « Defilement vertical » dans :
Javascript - Centrer verticalement une page web VoirPour centrer verticalement une page web, impossible de s'en sortir en css. Une solution bien pratique : JavaScript. 1. Le fichier .js 2. La page .html 3. Utilisation 4. Inconvénients 5. Rappel Merci à Dalida pour la source du...
Définir une hauteur verticale et relative à un élément VoirParfois, on voudrait définir une hauteur verticale à un élément. C'est simple en utilisant des valeurs fixes (en pixels pas exemple), mais c'est plus compliqué en utilisant des hauteurs relatives (en pourcentages). Ce problème est souvent...

1

Matio, le 25 jun 2008 à 14:49:05

Salut,
Renseignes toi sur la balise <marquee> dont tu peux régler la durée le défilement (vertical ou horizontal) et tu pourras "l'arranger" avec une feuille de style, ça revient au même que le js mais c'est plus simple et lèger.

Répondre à Matio

2

amelie, le 25 jun 2008 à 17:43:32

Merci mais la balise marquee est deprécié par certaine navigateur c'est pour ça que je voudrais utilisé du js!
Peux tu m'aider stp?
Merci d'avance.

Répondre à amelie

3

Matio, le 25 jun 2008 à 18:18:49

<?php
mysql_connect("localhost", "root", "");
mysql_select_db("cantin");
$retour = mysql_query('SELECT * FROM news');
$date_mel = date("Y-m-d ");
while ($donnees = mysql_fetch_array($retour))
{

?>// on peut pas fermer la balise php ici et l'ouvrir à nouveau en dessous car il n'y aura pas prise en compte de ce que tu essaie de faire dans le while

<a href="news1.html" target=" blank">

<script language="JavaScript">
var txt_defil_width = 400; //largeur
var txt_defil_height = 100; //hauteur
var txt_defil_bgcolor = '#000000'; //couleur de fond
var txt_defil_background = ""; //image de fond
var txt_defil_pause = 5000; //Temps en milliemes de secondes
var txt_defil_info = new Array;

txt_defil_info[0]='<a href="page1.htm" CLASS=txt_defil>lien1</a> texte 1';
txt_defil_info[1]='<a href="page2.htm" CLASS=txt_defil>lien2</a> texte 2';
txt_defil_info[2]='<a href="page3.htm" CLASS=txt_defil>lien3</a> texte 3';
txt_defil_info[3]='<iframe src="mon_iframe.htm" width="468" height="60" scrolling="no" frameborder="0"></iframe>';
</script>
<script language="JavaScript" src="textdefil2.js"></script>


<?php echo $donnees['TITRE'];? </a>

<?php
} // Fin de la boucle des news
?>
ici

Répondre à Matio

4

Matio, le 25 jun 2008 à 18:21:19

Pourrais tu poster le textdefil2.js

Répondre à Matio

5

amelie, le 25 jun 2008 à 19:11:29

Désolée,
j'ai changé le code puisque le premier ne fonctionnait pas.
Voici ce que j'ai obtenu : le titre de mes news s'affiche mais ne défile pas! Le code est en js!
Peux tu m'aider stp?
Merci d'avance.
Le code est le suivant :

<div id="scrollZone">

<div id="textToScroll" onmouseover="scrollingEnabled = false;" onmouseout="scrollingEnabled = true;scrollText();">
<?php
mysql_connect("localhost", "root", "");
mysql_select_db("cantin");

$retour = mysql_query('SELECT * FROM news');
$date_mel = date("Y-m-d ");

while ($donnees = mysql_fetch_array($retour))
{
?>
<a href="news1.html" target=" blank">
<?php echo $donnees['TITRE'];?>
</a>
<br><br>
<?php
} // Fin de la boucle des news
?>

</div>

<script type="text/javascript">
var scrollingEnabled = true;
var textHeight = new Number();
var zoneHeight = new Number();
var scrollSpeed = 20;
var scrollPause = 2000;

function $(obj){ return document.getElementById(obj); }

function iniScrolling(){
textHeight = $('textToScroll').offsetHeight;
zoneHeight = $('scrollZone').offsetHeight;
if(textHeight>zoneHeight) window.setTimeout('scrollText()', scrollPause);
}

function scrollText(){
var currentMargin = parseInt($('textToScroll').style.marginTop) || 0;
if(currentMargin>=-(textHeight-zoneHeight) && scrollingEnabled==true){
currentMargin--;
$('textToScroll').style.marginTop = currentMargin+'px';
window.setTimeout('scrollText()', scrollSpeed);
}else return;
}

window.onload = iniScrolling;
</script>

Répondre à amelie

6

amelie, le 25 jun 2008 à 19:19:24

Je corrige,
cela defile mais le pbroblème une fois toutes les news afficher, c'est que cela reste sur la dernière et c'est la dernière qui est fixe!
Ne peut on pas farie en sorte que cela boucle à l'infini?
Merci d'avance!

Répondre à amelie

7

Matio, le 25 jun 2008 à 19:39:27

Tu as oublié de fermé un div qq part


<div id="scrollZone">

<div id="textToScroll" onmouseover="scrollingEnabled = false;" onmouseout="scrollingEnabled = true;scrollText();">
<?php
mysql_connect("localhost", "root", "");
mysql_select_db("cantin");

$retour = mysql_query('SELECT * FROM news');
$date_mel = date("Y-m-d ");

while ($donnees = mysql_fetch_array($retour))
{
php echo $donnees['TITRE'];

echo '<br><br>';

} // Fin de la boucle des news
?>

</div>

<script language="javascript" type="text/javascript">
var scrollingEnabled = true;
var textHeight = new Number();
var zoneHeight = new Number();
var scrollSpeed = 20;
var scrollPause = 2000;

function $(obj){ return document.getElementById(obj); }

function iniScrolling(){
textHeight = $('textToScroll').offsetHeight;
zoneHeight = $('scrollZone').offsetHeight;
if(textHeight>zoneHeight) window.setTimeout('scrollText()', scrollPause);
}

function scrollText(){
var currentMargin = parseInt($('textToScroll').style.marginTop) || 0;
if(currentMargin>=-(textHeight-zoneHeight) && scrollingEnabled==true){
currentMargin--;
$('textToScroll').style.marginTop = currentMargin+'px';
window.setTimeout('scrollText()', scrollSpeed);
}else return;
}

body.onload = iniScrolling;
</script>


Peut être que ca va meiux marcher

Répondre à Matio

8

 amelie, le 25 jun 2008 à 19:51:07

Non ça ne fonctionne pas mieux puisque la rien ne defile!
Une autre idée?
Merci

Répondre à amelie