The Wall 1.0

The trailer: Trailer

Project site: wall.plasm.it

My portfolio: www.plasm.it



Details

Author
Marco Dell'Anna
Current version
1.0
GitHub
plasm/the-wall
Downloads
3366
Category
Interface
Tags
Report
GitHub Issues

Releases


Dependencies

  • _self_/_current_: core/1.3: '*'

How to use

Snippet code Javascript:


// Define The Wall
var maxLength = 100; // Max Number images or array length
var counter   = 1;
var wall = new Wall("wall", {
                "width":150,
                "height":150,
                "rangex":[-100,100],
                "rangey":[-100,100],
                callOnUpdate: function(items){
                    items.each(function(e, i){
                        // This is example code
                        var a = new Element("img[src=/your/folder/images/"+counter+".jpg]");
                            a.inject(e.node).fade("hide").fade("in");
                        counter++;
                        // Reset counter
                        if( counter > maxLength ) counter = 1;
                    })
                }
            });
// Init Wall
wall.initWall();

Snippet code HTML:


<!-- Viewport and Wall -->
<div id="viewport">
    <div id="wall"></div>
</div>
<!-- END Viewport and Wall -->

Snippet code CSS:


/* Minimal Css Required */
#viewport{
    width:900px;
    height:450px;
    position:relative;
    overflow:hidden;
    margin:0 auto;
    background:#111111  ;
}

#wall{
    z-index:1;
}

Discuss

A note on comments here: These comments are moderated. No comments will show up until they are approved. Comments that are not productive (i.e. inflammatory, rude, etc) will not be approved.

Found a bug in this plugin? Please report it this repository's Github Issues.

blog comments powered by Disqus