Ok, The Wall moves, repositions, makes everything by itself... but what if I want to move it to a particular coordinate? This tutorial shows how to make it.
Setting remains the one you have defined, you just need a few lines of JavaScript to instruct The Wall and move it to the coordinate you want.
Snippet code Css
var maxLength = 100; var counterFluid = 1; var wall = new Wall("wall", { "draggable":true, "autoposition":true, "inertia":true, "width":150, "height":150, "preload":true, "rangex":[-6,6], "rangey":[-6,6], callOnUpdate: function(items){ items.each(function(e, i){ var a = new Element("img[src=/path/your/images/"+counterFluid+".jpg]"); a.inject(e.node); counterFluid++; // Azzera counter if( counterFluid > maxLength ) counterFluid = 1; }) } }); // Init Fluid Wall wall.initWall(); // Behaviors $("mv-top").addEvent("click", function(e){ e.stop(); wall.moveTo(wall.getCoordinatesFromId(wall.getActiveItem()).c, -6); }.bind( this )) $("mv-bottom").addEvent("click", function(e){ e.stop(); wall.moveTo(wall.getCoordinatesFromId(wall.getActiveItem()).c, 5); }.bind( this )) $("mv-left").addEvent("click", function(e){ e.stop(); wall.moveTo(-6,wall.getCoordinatesFromId(wall.getActiveItem()).r); }.bind( this )) $("mv-right").addEvent("click", function(e){ e.stop(); wall.moveTo(5,wall.getCoordinatesFromId(wall.getActiveItem()).r); }.bind( this )) $("mv-center").addEvent("click", function(e){ e.stop(); wall.moveTo(0,0); }.bind( this ))