10-01-2013, 06:59 PM
Pas tout à fait, ça revoit un emboîtement de <div> avec des images en background qui sont déjà en cache (dixit mon débogueur).
Pour le code, en simplifier ça ressemble à ça :
Pour l'appel :
Et la réponse serveur (Je vous épargne tout les calculs et un maximum de détails) :
J'ai mis une URL fixe ici, mais la génération est dynamique et j'ai pas loin de 70 skins de case différentes.
Pour le code, en simplifier ça ressemble à ça :
Pour l'appel :
Code :
<script type="text/javascript">
(function($){
$.ajax({
type: "POST",
async: true,
url: "application/core/CartePage/load_map.php",
success: function(msg){
$('#map_content').html(msg);
$('#map_content').show();
$('#map_loader').hide();
}
});
})(jQuery);
</script>
Et la réponse serveur (Je vous épargne tout les calculs et un maximum de détails) :
Code :
<?php
/* ... */
for($y=0; $y<$this->data['taille_y']; $y++)
{
for($x=0; $x<$this->data['taille_x']; $x++)
{
$url = "url-de-mon-image.png";
$posX = $x;
$posY = $y;
?>
<div
id='case_<?php echo $x."_".$y; ?>'
class='case <?php echo $this->data['cases'][$x][$y]['block']; ?>'
style='top:<?php echo $posY; ?>px; left:<?php echo $posX; ?>px; background: url("<?php echo $url; ?>");'
></div>
<?php
}
}
J'ai mis une URL fixe ici, mais la génération est dynamique et j'ai pas loin de 70 skins de case différentes.