使用php加载图像并在图库中显示

问题描述：

I have made a javascript code that load dinamically images in a directory (php) and then display them using a jquery galery plugin.

I was unable to run the galleryView after all the pictures were loaded by the client. The single way was to use a delay command.

I don´t have to tell the disadvantages of this method. Does anyone knows how to "correct" the script so that the gallery plugin is called after all the images are loaded?

<script type="text/javascript">
    $("document").ready(function() {
         $('#aa').load('get_fotos.php').delay(2000).queue(function() {
              $('#aa').galleryView({
                     panel_width: 800,
                     panel_height: 400,
                     show_filmstrip_nav: false,
                     enable_slideshow: false,
                     panel_animation: 'crossfade',
                     frame_opacity: 1,
                     show_infobar: false,
                     frame_width: 80,
                     frame_height: 40,
                     // frame_scale: 'fit',
                });
        });
    });
</script>

Thanks a lot

我制作了一个javascript代码，在目录（php）中加载dinamically图像，然后使用jquery galery显示它们插件。 p>

在客户端加载所有图片后，我无法运行galleryView。单一方法是使用延迟命令。 p>

我不必告诉这种方法的缺点。有没有人知道如何“更正”脚本，以便在加载所有图像后调用图库插件？ p>

 ＆lt; script type =“text / javascript”＆gt;  
 $（“document”）。ready（function（）{
 $（'#aa'）。load（'get_fotos.php'）。delay（2000）.queue（function（）{
 $（'  #aa'）。galleryView（{
 panel_width：800，
 panel_height：400，
 show_filmstrip_nav：false，
 enable_slideshow：false，
 panel_animation：'crossfade'，
 frame_opacity：1，
 show_infobar：  false，
 frame_width：80，
 frame_height：40，
 // frame_scale：'fit'，
}）; 
}）; 
}）; 
＆lt; / script＆gt; 
  code  >  pre> 
 
 非常感谢 p> 
  div>

答

You can check this out by this:

It worked for me hope it helps.

imageArray = new Array();

imageArray[0] = 'image1.jpg'; // your image path
imageArray[1] = 'image2.jpg'; // your image path
htmldata='';
count = 0;
imgArray = new Array();

$.each(imageArray, function(i,item){
    var image=new Image();
    $(image).bind("load", {}, function(event) {
        count++;
        imageArray[i] =  $(image).attr("src");
        if(count==2){
            $("#imageHolder").empty();
            $.each(imageArray, function(j,item){
                htmldata = '<img id="image'+j+'" src="' + imageArray[j] +'" />';    //create ur image tag u need to call
                $("#imageHolder").append(htmldata);
            });

            $('#aa').galleryView({//call your bind method for plug in
            });
        }
    });
    image.src = imageArray[i];

使用php加载图像并在图库中显示

相关推荐