Bonjour tout le monde, je cherche un coup de main de quelqu’un connaissant bien le javascript, car je n'arrive pas à faire ce que je voudrais.
Je cherche à adapter ce très beau plugin sur mon site:
http://tympanus.net/codrops/2010/06/27/beautiful-photo-stack-gallery-with-jquery-and-css3/
Seulement la méthode de récupération par PHP des image ne me convient pas.
Actuellement le plugin fonctionne avec ce petit bout de php qui vas chercher les photos sur le serveur, dans un dossier album, ou se trouve d'autre dossier nommé album1, album2 etc.. ou se trouve les photos.
Et ensuite c'est exploité de cette façon dans le javascript:
Ce que j'aimerai faire c'est me passer de ce bout de php, et récupérer les images directement dans le javascript, depuis des liens que je placerai directement dans ma page html.
Je pensais récupérer les images à charger avec quelque chose du style:
Et en créant sur ma la html une liste de liens vers les photo que je cacherai si je lejavascript est activé.
du style:
Seulement je n'arrive à modifier le javascript en conséquence.
Est ce que quelqu’un comprend suffisamment ce language pour m’aider à remplace l'appel php par cette méthode de récupération des liens dans l'html ?
Merci d'avance pour celui qui prendra le temps de me répondre, j'ai conscienceque le problème n'est pas si facile.
Cordialement.[/i]
Je cherche à adapter ce très beau plugin sur mon site:
http://tympanus.net/codrops/2010/06/27/beautiful-photo-stack-gallery-with-jquery-and-css3/
Seulement la méthode de récupération par PHP des image ne me convient pas.
Actuellement le plugin fonctionne avec ce petit bout de php qui vas chercher les photos sur le serveur, dans un dossier album, ou se trouve d'autre dossier nommé album1, album2 etc.. ou se trouve les photos.
$location = 'albums';
$album_name = $_GET['album_name'];
$files = glob($location . '/' . $album_name . '/*.{jpg,gif,png}', GLOB_BRACE);
$encoded = json_encode($files);
echo $encoded;
unset($encoded);
Et ensuite c'est exploité de cette façon dans le javascript:
/**
* when we click on an album,
* we load with AJAX the list of pictures for that album.
* we randomly rotate them except the last one, which is
* the one the User sees first. We also resize and center each image.
*/
$ps_albums.children('div').bind('click',function(){
var $elem = $(this);
var album_name = 'album' + parseInt($elem.index() + 1);
var $loading = $('<div />',{className:'loading'});
$elem.append($loading);
$ps_container.find('img').remove();
$.get('photostack.php', {album_name:album_name} , function(data) {
var items_count = data.length;
for(var i = 0; i < items_count; ++i){
var item_source = data[i];
var cnt = 0;
$('<img />').load(function(){
var $image = $(this);
++cnt;
resizeCenterImage($image);
$ps_container.append($image);
var r = Math.floor(Math.random()*41)-20;
if(cnt < items_count){
$image.css({
'-moz-transform' :'rotate('+r+'deg)',
'-webkit-transform' :'rotate('+r+'deg)',
'transform' :'rotate('+r+'deg)'
});
}
if(cnt == items_count){
$loading.remove();
$ps_container.show();
$ps_close.show();
$ps_overlay.show();
}
}).attr('src',item_source);
}
},'json');
});
Ce que j'aimerai faire c'est me passer de ce bout de php, et récupérer les images directement dans le javascript, depuis des liens que je placerai directement dans ma page html.
Je pensais récupérer les images à charger avec quelque chose du style:
var $image = $('.maliste li a').attr("href");
Et en créant sur ma la html une liste de liens vers les photo que je cacherai si je lejavascript est activé.
du style:
<ul class="maliste hide">
<li><a href="IMG/test_a.jpg">image</a></li>
<li><a href="IMG/test_b.jpg">image</a></li>
<li><a href="IMG/test_c.jpg">image</a></li>
</ul>
Seulement je n'arrive à modifier le javascript en conséquence.
Est ce que quelqu’un comprend suffisamment ce language pour m’aider à remplace l'appel php par cette méthode de récupération des liens dans l'html ?
Merci d'avance pour celui qui prendra le temps de me répondre, j'ai conscienceque le problème n'est pas si facile.
Cordialement.[/i]