I'm in need of the same thing. I'm trying to work through the code on the anything slider in order to add it to the moving boxes but I'm a newbie at jquery and I can't seem to figure it out. Any help would be great.
I would like a circular gallery so that: * when I show last image, I would like load first image on the right-hand side of last image. if I click right button, then I would like load second image, and so on * when I show first image, and I click left button, then I would like load last image. and if I click again left button, then I would like load next to last image, and son on
It seems to work fine, but unfortunately I always got a blue border around links (text and image links...). Tried to set border to 0/none in html and css but´s still there. Any idea about that?
Any update on this question? I see that you are able to have the boxes loop (as seen in the change log Version 2.2 for the "wrap" option - https://github.com/chriscoyier/MovingBoxes). But, has anyone figured out a way for the boxes to slide automatically say every 3-5 seconds without the user having to click the right arrow? That would be a nice feature as well. Any help would be greatly appreciated!
thanks for the link. It looks great. Would be nice though if it just started automatically. Any way to have it start automatically without having someone needing to click "Play".
And, if you want it to play forever, just remove this from the loop function:
// if wrap is true, check for last slide, then stop slideshow if (mb.options.wrap !== true && mb.curPanel >= mb.totalPanels){ // click the button to pause $('button.slideshow').trigger('click'); return; }
@nori2tae In order to loop the slides in MovingBoxes, it clones the first and last slides. These clone slides are added to the end and beginning, respectively. So when you reach the last slide, you see the first cloned slide to the right. And when you see the first slide, the slide to the left of it is a clone of the last slide. When wrapping from the last to first slide, the script automatically jumps to the last cloned slide (left of the first slide) after you click the next arrow, this is why the slide to the left disappears. Also, if you are viewing the first slide and press the left arrow, the plugin repositions the slides so that the last slide (clone of the first slide) is centered, making the slide on the left disappear.
The only way to fix this would be to clone the first two slides, and the last two slides. Then things get really messy because the actual first slide is really the third slide.
I hope this all makes sense. Adding more code to cloning more slides just to prevent a brief flash of a slide disappearing while animating doesn't seem worth the effort to me. If it gets too annoying, just set the width of the slider and the width of the panels inside to be almost the same, so only one panel is visible at a time.
Its' great. But how do i move images automatically in infinite loop.
I am using slider.js and jquery-1.3.1.min.js
any change in js?
I have got the same problem of thakkermukund. I used http://css-tricks.com/examples/MovingBoxes/js/slider.js, I modified http://css-tricks.com/examples/MovingBo ... /style.css and I create my gallery in https://www.leadhouse.net/
I would like a circular gallery so that:
* when I show last image, I would like load first image on the right-hand side of last image. if I click right button, then I would like load second image, and so on
* when I show first image, and I click left button, then I would like load last image. and if I click again left button, then I would like load next to last image, and son on
is it possible with this gallery?
http://css-tricks.com/anythingslider-jquery-plugin/
Maybe you can either adapt that to your needs, or dissect what is going on there and implement it into the moving boxes design.
setInterval( function() {$('.mb-right').click();}, 5000 );
It seems to work fine, but unfortunately I always got a blue border around links (text and image links...). Tried to set border to 0/none in html and css but´s still there.
Any idea about that?
Et voila. Autoplay, looping and NO ugly blue border...
I made a demo with some code that interacts with MovingBoxes to make it into a slideshow: http://jsfiddle.net/Mottie/jMXx3/94/
I haven't integrated it into the plugin because I'm trying to decide if it should be an extension or added to the plugin core.
thanks for the link. It looks great. Would be nice though if it just started automatically. Any way to have it start automatically without having someone needing to click "Play".
Thanks!
And, if you want it to play forever, just remove this from the loop function:
Great script.
I am close to full satisfied, but one thing bothers me.
I set the wrap motion true then one element disappears
at some moment before sliding as i scroll around.
You can experience that in this example too.
http://jsfiddle.net/Mottie/jMXx3/94/
#set the circular motion true then try.
I would like to how to fix it.
Any comment or suggestion would be appreciated.
Thanx.
correct example: http://jsfiddle.net/nori2tae/CRq32/
It seems that this problem happens when the slide moves back to its default position.
open the slider.js
go to 77. line
write:
setInterval( function() { base.change(base.curPanel + 1); }, 5000 );
goodluck
@nori2tae In order to loop the slides in MovingBoxes, it clones the first and last slides. These clone slides are added to the end and beginning, respectively. So when you reach the last slide, you see the first cloned slide to the right. And when you see the first slide, the slide to the left of it is a clone of the last slide. When wrapping from the last to first slide, the script automatically jumps to the last cloned slide (left of the first slide) after you click the next arrow, this is why the slide to the left disappears. Also, if you are viewing the first slide and press the left arrow, the plugin repositions the slides so that the last slide (clone of the first slide) is centered, making the slide on the left disappear.
The only way to fix this would be to clone the first two slides, and the last two slides. Then things get really messy because the actual first slide is really the third slide.
I hope this all makes sense. Adding more code to cloning more slides just to prevent a brief flash of a slide disappearing while animating doesn't seem worth the effort to me. If it gets too annoying, just set the width of the slider and the width of the panels inside to be almost the same, so only one panel is visible at a time.