18043 sujets

Questions générales et questions de débutants

Probleme de mise en page

salut, je viens d creer un calendrier pour une page d'un site, mais je m'en rend compte que le calendrier ne s'affiche pas comme je le veux, les carreaux vides ne disparaissent pas, et la premiere semaine du mois de juin nest pas en ordre,
voici mon code php



<html>
	<head>
	
	<title>Calendrier</title>
	<link rel="stylesheet" type="text/css" href="style.css" />
	<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
	<script type="text/javascript">
		jQuery(function($){
			$('.month').hide();
			$('.month:first').show();
			$('.months a:first').addClass('active');
			var current = 1;
			$('.months a').click(function(){
				var month = $(this).attr('id').replace('linkmonth','');
				if (month != current){
					$('#month'+current).slideUp();
					$('#month'+month).slideDown();
					$('.months a').removeClass('active');
					$('.month a#linkmonth'+month).addClass('active');
					current=month;
				}
				return false;
			});
		
		});
	</script>
	</head>
	<body>
		<?php
			require('config.php');
			require('date.php');
			$date=new Date();
			$year=date('Y');
			$events=$date->getEvents($year);
			$dates=$date->getAll($year);
		?>
		<div class="periods">
			<div class="year"><?php echo $year; ?></div>
			<div class="months">
				<ul>
					<?php foreach ($date->months as $id=>$m): ?>
						<li><a href="#" id="linkmonth<?php echo $id+1;  ?>"><?php echo substr($m,0,4); ?></a></li>
					<?php endforeach; ?>
				</ul>
			</div>
			<div class="clear"></div>
			<?php $dates=current($dates); ?>
			<?php foreach ($dates as $m=>$days): ?>
				<div class="month relative"  id="month<?php echo $m; ?>">
				<table>
					<thead>
						<tr>
							<?php foreach($date->days as $d): ?>
								<th><?php echo substr($d,0,3); ?></th>
							<?php endforeach; ?>
						</tr>
					</thead>
					<tbody>
						<tr>
						<?php $end=end($days); foreach($days as $d=>$w): ?>
						<?php $time = strtotime("$year-$m-$d"); ?>
							<?php if ($d==1): ?>
								<td colspan="<?php echo $w-1; ?>"  class="padding"></td>
							<?php endif; ?>
							<td>
								<div class="relative">
								<div class="day"><?php echo $d; ?></div>
								</div>
								<div class="daytitle">
									<?php echo $date->days[$w-1]; ?><?php echo $d; ?><?php echo $date->months[$m-1]; ?>
								</div>
								<ul class="events">
									<?php if (isset( $events[$time])): foreach($events[$time] as $e): ?>
										<li><?php echo $e; ?></li>
									<?php endforeach; endif; ?>
								</ul>
							</td>
							<?php if ($w==7): ?>
							</tr><tr>
							<?php endif; ?>
						<?php endforeach; ?>
						<?php if ($end != 7): ?>
							<td colspan="<?php echo 7-$end; ?>"></td>
						<?php endif; ?>
						</tr>
					</tbody>					
				</table>
				</div>
			<?php endforeach;?>
		</div>
		<div class="clear"></div>
		
	</body>
</html>



<?php
	class Date{
	
		var $days   = array('Lundi','Mardi','Mercredi','Jeudi','Vendredi','Samedi','Dimanche');
		var $months = array('Janvier','Février','Mars','Avril','Mai','Juin','Juillet','Août','Septembre','Octobre','Novembre','Décembre');
		
		function getEvents($year){
			global $db;
			$req = $db->query('SELECT id,commune,centre,date,heure FROM enreg WHERE YEAR(date)='.$year);
			$r = array();
			while ($d = $req->fetch(PDO::FETCH_OBJ)){
				$r[strtotime($d->date)][$d->id] = $d->heure;	
			}
			return $r;
		}
		
		
		function getAll($year){
			$r=array();
			
			$date=strtotime($year.'-01-01');
			while(date('Y',$date)<=$year){
			$y=date('Y',$date);
			$m=date('n',$date);
			$d=date('j',$date);
			$w=str_replace('0','7',date('w',$date));
			$r[$y][$m][$d]=$w;
			$date=strtotime(date('Y-m-d',$date).' +1 DAY');
			}
		
		/*
			$date=new DateTime($year.'-01-01');
			while($date->format('Y') <= $year){
			$y=$date->format('Y');
			$m=$date->format('n');
			$d=$date->format('j');
			$w=str_replace('0','7',$date->format('w'));
			$r[$y][$m][$d]=$w;
			$date->add(new DateIntervalle('P1D'));
			}
		*/
			return $r;
		}

	}
?>


et voici mon code css


body{background:#EEEEEE; letter-spacing:1px; font-family:helvetica; padding:10px;}
.year{color:#D90000; font-size:85px;}
.relative{position:relative;}
.months{}
.month{margin-top:12px;}
.months ul{list-style:none; margin:0px; padding:0px;}
.months ul li a{float:left; margin:-4px; padding:0px 15px 0px 0px; text-decoration:none; color:#888888; font-size:24px;  text-transform: uppercase; font-weight:bold;}
.months ul li a:hover, .months ul li a:active{color:#D90000;}
table{border-collapse:collapse;}
table td{border:1px solid #A3A3A3; width:80px; height:80px;}
table td.today{ border:1px solid:#888888; width:80px; height:80px;}
table.td.padding{ border:none;}
table td:hover{background:#DFDFDF; cursor:pointer;}
table th{font-weight:normal; color:#A8A8A8;}
table td .day{position:absolute; color:#8C8C8C; bottom:-40px; right:5px; font-weight:bold;}
table td .events{position:relative; width:79px; height:0px; margin:-39px 0px 0px;}
table td .events li{width:10px; height:10px; float:left; background:#000;}
table td:hover .events{position:absolute; left:582px; top:66px; width:442px;}
table td:hover .events li{height:40px; line-height:40px; font-weight:bold;}
table td:hover .events li:first-child{ border-top:1px; solid:#D6D6D6;}
.clear{
clear:both;
}
table td .daytitle{ display:none;}
table td:hover .daytitle{ position:absolute; left:582px; top:21px; width:442px; list-style:none;}



sil vous plait jai vraiment besoin que vous maidiez, je suis nouveau sur ce forum donc si je me trompes dans la maniere de faire rectifiez moi,
merci..... Smiley smile et jespere avoir des reponses
Modifié par kyra (22 Jun 2015 - 21:15)
Sujet clos
Aller à