Grille / Quadrillage en PHP

**Geoffrey74** · 29/04/2013, 23h18

Bonsoir à tous,

j'essaie de me lancé dans une mission impossible, et je bloque déjà au début ^^

J'aimerai pouvoir créer un quadrillage en php. La taille n'a pas d'importance pour le moment.

J'ai regarder un peu les outils php mais je n'ai pas trouver ce que je cherchais.
Dans mes souvenir j'en ai déjà utiliser lorsque j'étais étudiant pour des stats météos, mais impossible de remettre la main dessus.

A savoir qu'après, j'aimerai pouvoir, au survole du quadrillage, coloré certaines cases (avec du js par exemple), donc si possible que se soit compatible.

Je demande juste une idée de base, bien entendu je cherche de mon coté

**andry.aime** · 30/04/2013, 10h03

Bonjour,

Tu peux utiliser la librairie GD, voici un tutoriel.

A+.

**Benjamin Delespierre** · 30/04/2013, 11h39

Si tu veux pouvoir animer ta grille avec du JS, tu peux la faire avec du CSS:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
<?php
 
// Configuration de la grille
 
$grid_width  = 10; // largeur de la grille
$grid_height = 10; // hauteur de la grille
$cell_width  = 25; // largeur d'une cellule
$cell_height = 25; // hauteur d'une cellule
$gutter      = 5;  // espacement des cellules
 
?>
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Grid</title>
    <style type="text/css" media="screen">
    .grid .row {
        margin-left: -<?=$gutter?>px;
    }
 
    .grid .row:after {
        content: " ";
        visibility: hidden;
        display: block;
        height: 0;
        clear: both;
    }
 
    .grid .cell {
        display: block;
        float: left;
        margin-left: <?=$gutter?>px;
        margin-bottom: <?=$gutter?>px;
        width: <?=$cell_width?>px;
        height: <?=$cell_height?>px;
        border: 1px solid #ddd;
        border-top: none;
        border-left: none;
    }
    </style>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script type="text/javascript">
    $(function () {
        $('.cell').hover(
            function () {
                $(this).css('background', '#eee');
            },
            function () {
                $(this).css('background', 'white');
            }
        );
    });
    </script>
</head>
<body>
    <div class="grid">
    <? for ($w=0; $w<$grid_width; $w++): ?>
        <div class="row">
        <? for ($h=0; $h<$grid_height; $h++): ?>
            <span class="cell"></span>
        <? endfor ?>
        </div>
    <? endfor ?>
    </div>
</body>
</html>

C'est tellement simple que c'est même pas drôle

**Geoffrey74** · 30/04/2013, 13h51

Pas simple pour tous le monde, même avec ce que tu me donne j'ai une erreur ^^

$ is not defined

Pourtant la librairie est bien chargée :-\

**Benjamin Delespierre** · 30/04/2013, 14h24

C'est l'inclusion de jQuery qui foire alors. corrige ça

**Geoffrey74** · 30/04/2013, 17h22

J'ai une erreur sur la 1ere partie du css :

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
.grid .row {
        margin-left: -5 px;
    }

Erreur d'analyse de la valeur pour «*margin-left*». Déclaration abandonnée.

Capte pas :-\

Grille / Quadrillage en PHP

Langage PHP

Vue hybride

Discussions similaires

Partager

Partager