5568 sujets

Sémantique web et HTML

Salut tout le monde,

J'ai un compteur que j'aimerais mettre à un certain endroit dans ma page.

Le problème est que le compteur vient se mettre tout au dessus de la page (voir miniature attachée).

Sauriez-vous me dire comment je pourrais mettre le compteur où se trouve le rectangle rouge dans la miniature attachée ?

Voici le code de ma page :

<?php 
	session_start();
	include('Scripts/connexion.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">
<!-- DW6 -->
<head>
<!-- Copyright 2005 Macromedia, Inc. All rights reserved. -->
<title>Page d'accueil</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" href="mm_health_nutr.css" type="text/css" />

<style type="text/css">

	.Style1 {font-size: 18px}
	.Style6 {font-weight: bold; font-size: 16px;}

</style>
<script type="text/javascript" src="PDF/imprimer.js"></script>
<script type="text/javascript" src="AJAX/prototype.js"></script>
<script type="text/javascript" src="Scripts/Ajax_Listes_Deroulantes_Generiques_Types.js"></script> 
<script type="text/javascript" src="Scripts/Ajax_Listes_Deroulantes_Generiques_Categories.js"></script>
<script type="text/javascript" src="Scripts/Ajax_Listes_Deroulantes_Generiques.js"></script>
<script type="text/javascript" src="js/Liaison_bouton.js"></script> 
<script type="text/javascript" src="AJAX/Affichage_Etudiants.js"></script>
<script type="text/javascript" src="js/ChiffresOnly.js"></script>
<script type="text/javascript" src="js/cote_originale.js"></script>
<script type="text/javascript" src="REGEX/regex.js"></script>
<script type="text/javascript" src="AJAX/udpate_notes.js"></script>
<script type="text/javascript" src="js/cloture.js"></script>
<script type="text/javascript" src="js/ClotureOuPas.js"></script>
<script type="text/javascript" src="js/cacher_bouton_cloture.js"></script>
<script type="text/javascript" src="js/compteur.js"></script>
<script type="text/javascript" src="js/TextExcel_menu_utilisateur_import.js"></script>
<script type="text/javascript" src="js/TextExcel_menu_utilisateur.js"></script>
<link title="CSS_Couleur" type="text/css" rel="stylesheet" href="CSS/couleurs.css"> 


<script type='text/javascript'>
function emptySel(sel)
{
   while(sel.options[0])
   {
     sel.removeChild(sel.options[0])
   }
} 
</script>


</head>

<body bgcolor="#F4FFE4">
<?php include('Nom_Prenom_Prof.php'); ?>

<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr bgcolor="#D5EDB3">
    <td colspan="3" rowspan="2">&nbsp;</td>
    <td height="50" colspan="3" id="logo" valign="bottom" align="center" nowrap="nowrap"><div align="left" >Bienvenue Professeur <?php echo $_SESSION['Nom']; ?>  </div></td>
    <td width="58">&nbsp;</td>
  </tr>

  <tr bgcolor="#D5EDB3">
    <td height="51" colspan="3" id="tagline" valign="top" align="center"><div align="left"><br /> 
 </div></td>
	<td width="58">&nbsp;</td>
  </tr>

  <tr>
    <td colspan="7" bgcolor="#5C743D"><img src="mm_spacer.gif" alt="" width="1" height="2" border="0" /></td>
  </tr>

  <tr>
    <td colspan="7" bgcolor="#99CC66" background="mm_dashed_line.gif"><img src="mm_dashed_line.gif" alt="line decor" width="4" height="3" border="0" /></td>
  </tr>

  <tr bgcolor="#99CC66">
  	<td colspan="7" id="dateformat" height="20">&nbsp;&nbsp;
  	  <div align="center">
  	  <!-- Afin de ne pas devoir chaque année changer l'année acadméique, je le fais en PHP --> 
    <span class="Style1">ANNEE ACADEMIQUE <?php include('Annee_Academique.php'); ?> 
    
    </span></div></td>
  </tr>
  <tr>
    <td colspan="7" bgcolor="#99CC66" background="mm_dashed_line.gif"><img src="mm_dashed_line.gif" alt="line decor" width="4" height="3" border="0" /></td>
  </tr>

  <tr>
    <td colspan="7" bgcolor="#5C743D"><img src="mm_spacer.gif" alt="" width="1" height="2" border="0" /></td>
  </tr>

 <tr>
    <td width="167" valign="top" bgcolor="#5C743D">
<!--Si c'est un utilisateur, on affiche le menu utilisateur, autrement on affiche le menu administrateur-->

<?php	
if($_SESSION['TypeVisiteur'] == "Utilisateur")
	include('Scripts/Menu_Utilisateurs.php');
else
	include('Scripts/Menu_Administrateur.php'); 
?>	
    <td width="50"><img src="mm_spacer.gif" alt="" width="50" height="1" border="0" /></td>
   <td colspan="2" valign="top"><img src="mm_spacer.gif" alt="" width="305" height="1" border="0" /><br />
	&nbsp;<br />
	&nbsp;<br />
	<table border="0" cellspacing="0" cellpadding="0" width="538">
        <tr>
          <div id="titre">
            <td width="474" class="pageName">TEMPS RESTANT POUR ENCODER VOS COTES  : <div id="compteur">  <script language="javascript" src="js/compteur.js"></script>   </div></td>
          </div>
		</tr>

		<tr>
          <td class="bodyText"></td>
        </tr>
     </table>
	<p>
<?php 
if($_SESSION['TypeVisiteur'] == "Administrateur")
{
	//c'est ici que l'on va remplir la frame centrale du site
	include('Scripts/Changer_De_Table.php');
}
else
{ ?>
	<!--<tr> c'est une ligne (row) et td c'est une cellule-->
	<form name="frm_Listes_Deroulantes" action="" method="post">
	<table border=0 id="tableau_AJAX">
		<tr>
			<td> <?php
				//c'est ici que l'on va remplir la frame centrale du site
				include('Scripts/Afficher_Mnemonic_Par_Rapport_Liste_Deroulante.php');
				?>
			</td>
			
			<td>
				<?php	
				//c'est ici que l'on va remplir la frame centrale du site
				include('Scripts/Charger_Types_Cours_Liste_Deroulante.php');
				?>
			</td>
			
			<td>
				<?php	
				//c'est ici que l'on va remplir la frame centrale du site
				include('Scripts/Charger_Categories_Liste_Deroulante.php');				
				?>
				 
				
			</td>
			
			<td>
			
			<div id="div_bouton"></div>
					<input type="submit" style="display:none"/>
			
			</td>
			
<td><input type="submit" name="imprimer" id="imprimer" value="Imprimer" onclick="Imprimer();"/></td><td><div id="div_cloturer"></div></td>			

<td><div id="div_cloturer"></div></td>
		</tr>
		

	</table>
	 
	</form>
    <p>
      <?php	
}

?>

    </p>
    <p>&nbsp;</p>
    <p>
	
    <div id="div_Affichage" align="center"></div> 
    </p>
   </body>
</html>


Voici le code de ma page javascript :

// JavaScript Document
/*
Count Down - Script
Visit  http://rainbow.arch.scriptmania.com/scripts/
 
 for this script and many more
*/


function setcountdown(theyear,themonth,theday,thehour,themin,thesec){
yr=theyear;mo=themonth;da=theday;hr=thehour;min=themin;sec=thesec
}

//////////CONFIGURE THE COUNTDOWN SCRIPT HERE//////////////////

//STEP 1: Configure the countdown-to date, in the format year, month, day, hour(0=midnight,23=11pm), minutes, seconds:
setcountdown(2009,06,24,09,00,00)

//STEP 2: Change the two text below to reflect the occasion, and message to display on that occasion, respectively
var occasion=""
var message_on_occasion="La mise à jour des cotes est clôturée."

//STEP 3: Configure the below 5 variables to set the width, height, background color, and text style of the countdown area
var countdownwidth='550px'
var countdownheight='35px'
var countdownbgcolor='lightblue'
var opentags='<font face="Verdana" color="blue"><small>'
var closetags='</small></font>'

//////////DO NOT EDIT PAST THIS LINE//////////////////

var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec")
var crosscount=''

function start_countdown(){
if (document.layers)
document.countdownnsmain.visibility="show"
else if (document.all||document.getElementById)
crosscount=document.getElementById&&!document.all?document.getElementById("countdownie") : countdownie
countdown()
}

if (document.all||document.getElementById)
document.write('<span id="countdownie" style="width:'+countdownwidth+'; background-color:'+countdownbgcolor+'"></span>')

window.onload=start_countdown


function countdown(){
var today=new Date()
var todayy=today.getYear()
if (todayy < 1000)
todayy+=1900
var todaym=today.getMonth()
var todayd=today.getDate()
var todayh=today.getHours()
var todaymin=today.getMinutes()
var todaysec=today.getSeconds()
var todaystring=montharray[todaym]+" "+todayd+", "+todayy+" "+todayh+":"+todaymin+":"+todaysec
futurestring=montharray[mo-1]+" "+da+", "+yr+" "+hr+":"+min+":"+sec
dd=Date.parse(futurestring)-Date.parse(todaystring)
dday=Math.floor(dd/(60*60*1000*24)*1)
dhour=Math.floor((dd%(60*60*1000*24))/(60*60*1000)*1)
dmin=Math.floor(((dd%(60*60*1000*24))%(60*60*1000))/(60*1000)*1)
dsec=Math.floor((((dd%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1)
//if on day of occasion
if(dday<=0&&dhour<=0&&dmin<=0&&dsec<=1&&todayd==da){
if (document.layers){
document.countdownnsmain.document.countdownnssub.document.write(opentags+message_on_occasion+closetags)
document.countdownnsmain.document.countdownnssub.document.close()
}
else if (document.all||document.getElementById)
crosscount.innerHTML=opentags+message_on_occasion+closetags
return
}
//if passed day of occasion
else if (dday<=-1){
if (document.layers){
document.countdownnsmain.document.countdownnssub.document.write(opentags+"cotes clôturées! "+closetags)
document.countdownnsmain.document.countdownnssub.document.close()
}
else if (document.all||document.getElementById)
crosscount.innerHTML=opentags+"Occasion already passed! "+closetags
return
}
//else, if not yet
else{
if (document.layers){
document.countdownnsmain.document.countdownnssub.document.write(opentags+dday+ " days, "+dhour+" hours, "+dmin+" minutes, and "+dsec+" seconds left until "+occasion+closetags)
document.countdownnsmain.document.countdownnssub.document.close()
}
else if (document.all||document.getElementById)
crosscount.innerHTML=opentags+dday+ " jour(s), "+dhour+" heure(s), "+dmin+" minute(s), and "+dsec+" seconde(s)  "+occasion+closetags
}
setTimeout("countdown()",1000)
}



Liens de l'image :

beegeeshttp://164.15.111.52/compteur.jpg

Merci d'avance pour votre aide.

beegees
Modifié par beegees (22 Feb 2009 - 19:18)
Salut,

Je pense que le problème vient de cette ligne de ton javascript :

document.write('<span id="countdownie" style="width:'+countdownwidth+'; background-color:'+countdownbgcolor+'"></span>')


A cet endroit tu crée un span dans le document, mais tu ne lui dis pas où,alors il la crée directement dans le body où il peut. Jep ense qu'il faut lui spécifier à quel endroit il doit créer ce span. Maintenant comment, je ne sais pas, j'ai plutot l'habitude de programmer avec un framework donc voilà ^^.

En espérant avoir pû t'aider un peu Smiley cligne
Salut,

Cela m'a énormément aidé, merci beaucoup.

if (document.all||document.getElementById('compteur')) //C'est ici que l'on met l'ID du div dans lequle le compteur va se mettre
document.write('<span id="countdownie" style="width:'+countdownwidth+'; background-color:'+countdownbgcolor+'"></span>')


Encore merci à toi.

beegees