trends4media

Bonjour,

J'ai la chose suivante à faire qui est très simple avec un tableau mais j'aimerais savoir si on peut le faire sans tableau : je voudrais aligner deux images côte à côte sans utiliser de tableau.

Code:

1
2
<img title="texte_accueil" src="http://www.developpez.net/forums/images/titre_site.png" alt="Jean-Martin Barbut Photographies haute et très haute résolution" />
<img title="image_accueil" src="http://www.developpez.net/forums/images/image_accueil.jpg" alt="Buste femme" id="image_accueil">

Ce code fonctionne mais si je réduis la largeur du navigateur web une image passe sous l'autre. JE voudrais donc faire cela sans utiliser de tableau :

http://photo.jeanmartinbarbut.fr/web/home.html

Merci !

Bonjour,

je cherche à trier des images par drag and drop (j'y suis arrivé) dans des catégories et à ce que soit enregistré dans la BDD.
j'ai trouvé des choses dont je me suis inspiré mais impossible de finaliser :oops:

mais je souhaiterai aussi que quand on clique sur l'image, elle fasse apparaitre dans une div un formulaire pour ajouter des commentaires (si c'est pas trop demander :lol:)

Merci de votre aide !

Voici le code :

Code:

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
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133


<fieldset>
        <legend><h3 id="affich">Classement des photos et commentaires</h3></legend>


<div class="span5">


<?PHP 

  $path  = "http://www.mon-site.com/upload/$id_membre/cabinet";
  $pathS = "http://www.mon-site.com/upload/$id_membre/cabinet/small";




// Affiche les non classés
$resultat0 = mysql_query("SELECT * FROM $table_photos WHERE Pid=$id_membre AND Pcat='1' AND Pcategorie='' ORDER BY Pordre ASC");

        echo '<fieldset><legend><h4>Non class&eacute;</h4></legend>
              <div id="Non class&eacute;" class="sortable-list">'; 

 while ($row=mysql_fetch_array($resultat0)) { 

  if (mysql_num_rows($resultat0)==0) {echo 'Pas de photo';} 
  else {

  $Image = explode(".", $row["Pnom"]);
    $NomImage = $Image[0];
    $ExtentionImage = $Image[1];

echo '
    <a href="'.$path.'/'.$NomImage.'.'.$ExtentionImage.'" title="'.$row["Pdescriptif"].'" id='.$row["idPhoto"].'">
        <img src="'.$pathS.'/'.$NomImage.'_thumb.'.$ExtentionImage.'" alt="'.$row["Pdescriptif"].'" style="max-width: 50px;padding:5px;">
    </a> ';

        };
                                              }; // fin du while

echo '</div></fieldset>';





// Affiche les catégories                                              

$resultat1 = mysql_query("SELECT * FROM $table_cat_photos WHERE id_Mbre=$id_membre");

  $row1=mysql_fetch_array($resultat1); 

  $liste_cat = explode("##", $row1['categories'], "-1");
  for($i=0; $i<count($liste_cat);$i++ ) { list($CatOrdre, $CatNom) = explode("|", $liste_cat[$i]);

            echo '<fieldset><legend><h4>'.$CatNom.'</h4></legend>
              <div id="'.$CatNom.'" class="sortable-list">'; 


    // Affiche les images par catégories   
    $resultat2 = mysql_query("SELECT * FROM $table_photos WHERE Pid=$id_membre AND Pcat='1' AND Pcategorie=$CatNom ORDER BY Pordre ASC");

  if (mysql_num_rows($resultat2)==0) {echo '&nbsp;<br>';} 
  else {

 while ($row2=mysql_fetch_array($resultat2)) { 



  $Image = explode(".", $row2["Pnom"]);
    $NomImage = $Image[0];
    $ExtentionImage = $Image[1];

echo '
    <a href="'.$path.'/'.$NomImage.'.'.$ExtentionImage.'" title="'.$row2["Pdescriptif"].'" id='.$row2["idPhoto"].'">
        <img src="'.$pathS.'/'.$NomImage.'_thumb.'.$ExtentionImage.'" alt="'.$row2["Pdescriptif"].'" style="max-width: 50px;padding:5px;">
    </a> ';

        }; // fin du while
                                              }; 

echo '</div></fieldset><br>';

                                              }; // fin du for



?>



</div>

<div id="formulaire" class="span7">





</div>








<script>
var __links = document.querySelectorAll('a');
function __linkClick(e) { parent.window.postMessage(this.href, '*');} ;
for (var i = 0, l = __links.length; i < l; i++) {if ( __links[i].getAttribute('data-t') == '_blank' ) { __links[i].addEventListener('click', __linkClick, false);}}
</script>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>

<script>$('.sortable-list').sortable({
  connectWith: '.sortable-list',
  update: function(event, ui) {
    var changedList = this.id;
    var order = $(this).sortable('toArray');
    var positions = order.join(';');

    console.log({
      id: changedList,
      positions: positions
    });
  }
});


</script>

trends4media

Pages

Aligner côte à côte 2 images sans tableau sujet

mardi 8 avril 2014

Tri images dans catégories et enregistrement base de donnée sujet

samedi 29 mars 2014

[Problème] montage images qualités très différentes sujet

mercredi 29 janvier 2014