5 Replies Latest reply on Aug 4, 2014 8:33 AM by dharmk

    Which code do I need for next and prev button with jquery bgndgallery fullscreen image slider

    Casu2013

      Hello,

       

      I use an open source jquery bgndgallery (http://pupunzi.open-lab.com/mb-jquery-components/jquery-mb-bgndgallery/ for a fullscreen image slider with my adobe edge project.

      The fullscreen bgndgallery works with my Edge project.

       

      In CreationComplete I put the following code and when I set autoStart on 'true' the slider works:

      $.mbBgndGallery.buildGallery({

       

      containment:"body",

      effect:"slideLeft",

      autoStart:false,

      timer:3000,

      effTimer:1500,

      controls:"#controls",

      images:[

      "images/cover.jpg",

      "images/p1.jpg"

      ],

       

                  onStart:function(){},

                  onPause:function(){},

                  onPlay:function(opt){},

                  onChange:function(opt,idx){},

                  onNext:function(opt){},

                  onPrev:function(opt){}

       

                  //onStart:function(){},

                  //onPause:function(){},

                  //onPlay:function(opt){},

                  //onChange:function(idx){

       

                  //onNext:function(opt){opt.effect = "slideLeft"},

                  //onPrev:function(opt){opt.effect = "slideRight"}

       

                  //onStart:function(){$("#controls .play").show();$("#controls .pause").hide();},

                  //onPause:function(){$("#controls .play").show();$("#controls .pause").hide();},

                  //onPlay:function(o){$("#controls .play").hide();$("#controls .pause").show();},

                  //onNext:function(o){o.effect="slideLeft"},

                  //onPrev:function(o){o.effect="slideRight"}

       

      })

       

      But I would like to control the background slider with next and previous button. So when I click on the

      next button in Adobe Edge. The slider will slide from right to left. I've tried al lot of things but nothing works.

      And I'm not so good in coding, I'm more a designer.

       

      This is a few things what I already tried:

      on the next button I put the following code in 'Click':

      $("body").slideLeft();

       

      I found the following code for a fade-out and that worked but that isn't what I would like to do:

      $("body").fadeOut(function(){$("body").html(caption[idx]).fadeIn()});

       

      The script for the jquery.mb.bgndGallery you can find it here:

      jquery.mb.bgndGallery/mb.bgndGallery.js at master · pupunzi/jquery.mb.bgndGallery · GitHub

       

      So I hope that somebody can help me with the right code for the next and previous buttons.

       

      Thanks