duanbianweng5353 2014-05-27 05:54
浏览 55
已采纳

在PHP中将图像动态添加到JQuery滑块

I've got a problem using JavaScript Array. There is an Image gallery. I wanna dynamically load images to this gallery.
Here is the javaScript function to that gallary.

var LoadGallary=function(key){

        var mygallery=new simpleGallery({
        wrapperid: "imgGal", //ID of main gallery container,
        dimensions: [getWidth(), 250], //width/height of gallery in pixels. Should reflect dimensions of the images exactly
        imagearray:  [
        ["Images/Home/slider/1.jpg", "#", "", "Image 1"],
        ["Images/Home/slider/2.jpg", "#", "", "Image 2"],
        ["Images/Home/slider/3.jpg", "#", "", "Image 3"],
        ["Images/Home/slider/4.jpg", "#", "", "Image 4"],
        ["Images/Home/slider/5.jpg", "#", "", "Image 5"],
        ["Images/Home/slider/6.jpg", "#", "", "Image 6"]
        ],
        autoplay: [true, 2500, 1000], //[auto_play_boolean, delay_btw_slide_millisec, cycles_before_stopping_int]
        persist: false, //remember last viewed slide and recall within same session?
        fadeduration: 1500, //transition duration (milliseconds)
        oninit:function(){ //event that fires when gallery has initialized/ ready to run
            //Keyword "this": references current gallery instance (ie: try this.navigate("play/pause"))
        },
        onslide:function(curslide, i){ //event that fires after each slide is shown
            //Keyword "this": references current gallery instance
            //curslide: returns DOM reference to current slide's DIV (ie: try alert(curslide.innerHTML)
            //i: integer reflecting current image within collection being shown (0=1st image, 1=2nd etc)
        }
    })
    }

"key" is the gallery ID. I've tried to fill this array using PUSH method like below.

        var LoadGallary=function(key){

        var arr = new Array();
        arr.push(["Images/Home/slider/1.jpg", "#", "", "Image 1"]);
        arr.push(["Images/Home/slider/2.jpg", "#", "", "Image 2"]);
        arr.push(["Images/Home/slider/3.jpg", "#", "", "Image 3"]);
        arr.push(["Images/Home/slider/4.jpg", "#", "", "Image 4"]);
        arr.push(["Images/Home/slider/5.jpg", "#", "", "Image 5"]);
        arr.push(["Images/Home/slider/6.jpg", "#", "", "Image 6"]);

        var mygallery=new simpleGallery({
        wrapperid: "imgGal", //ID of main gallery container,
        dimensions: [getWidth(), 250], //width/height of gallery in pixels. Should reflect dimensions of the images exactly
        imagearray:  [
            arr
        ],
        autoplay: [true, 2500, 1000], //[auto_play_boolean, delay_btw_slide_millisec, cycles_before_stopping_int]
        persist: false, //remember last viewed slide and recall within same session?
        fadeduration: 1500, //transition duration (milliseconds)
        oninit:function(){ //event that fires when gallery has initialized/ ready to run
            //Keyword "this": references current gallery instance (ie: try this.navigate("play/pause"))
        },
        onslide:function(curslide, i){ //event that fires after each slide is shown
            //Keyword "this": references current gallery instance
            //curslide: returns DOM reference to current slide's DIV (ie: try alert(curslide.innerHTML)
            //i: integer reflecting current image within collection being shown (0=1st image, 1=2nd etc)
        }
    })
    }

But it doesn't work.

  • 写回答

1条回答 默认 最新

  • dongshijiao2363 2014-05-27 07:37
    关注

    While you initialize you simpleGallery plugin try using as shown below:

    ......
    .......
    imagearray:arr,//removed the enclosing square brackets
    .....
    .....
    

    so your new code would look like:

    var LoadGallary=function(key){

        var arr = new Array();
        arr.push(["Images/Home/slider/1.jpg", "#", "", "Image 1"]);
        arr.push(["Images/Home/slider/2.jpg", "#", "", "Image 2"]);
        arr.push(["Images/Home/slider/3.jpg", "#", "", "Image 3"]);
        arr.push(["Images/Home/slider/4.jpg", "#", "", "Image 4"]);
        arr.push(["Images/Home/slider/5.jpg", "#", "", "Image 5"]);
        arr.push(["Images/Home/slider/6.jpg", "#", "", "Image 6"]);
    
        var mygallery=new simpleGallery({
        wrapperid: "imgGal", //ID of main gallery container,
        dimensions: [getWidth(), 250], //width/height of gallery in pixels. Should reflect dimensions of the images exactly
        imagearray:arr,//please note made a change here: removed square brackets
        autoplay: [true, 2500, 1000], //[auto_play_boolean, delay_btw_slide_millisec, cycles_before_stopping_int]
        persist: false, //remember last viewed slide and recall within same session?
        fadeduration: 1500, //transition duration (milliseconds)
        oninit:function(){ //event that fires when gallery has initialized/ ready to run
            //Keyword "this": references current gallery instance (ie: try this.navigate("play/pause"))
        },
        onslide:function(curslide, i){ //event that fires after each slide is shown
            //Keyword "this": references current gallery instance
            //curslide: returns DOM reference to current slide's DIV (ie: try alert(curslide.innerHTML)
            //i: integer reflecting current image within collection being shown (0=1st image, 1=2nd etc)
        }
    })
    }
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

悬赏问题

  • ¥15 file converter 转换格式失败 报错 Error marking filters as finished,如何解决?
  • ¥15 ubuntu系统下挂载磁盘上执行./提示权限不够
  • ¥15 Arcgis相交分析无法绘制一个或多个图形
  • ¥15 关于#r语言#的问题:差异分析前数据准备,报错Error in data[, sampleName1] : subscript out of bounds请问怎么解决呀以下是全部代码:
  • ¥15 seatunnel-web使用SQL组件时候后台报错,无法找到表格
  • ¥15 fpga自动售货机数码管(相关搜索:数字时钟)
  • ¥15 用前端向数据库插入数据,通过debug发现数据能走到后端,但是放行之后就会提示错误
  • ¥30 3天&7天&&15天&销量如何统计同一行
  • ¥30 帮我写一段可以读取LD2450数据并计算距离的Arduino代码
  • ¥15 飞机曲面部件如机翼,壁板等具体的孔位模型