MagicWall – Responsive Image Grid Download

MagicWall – Responsive Image Grid – If youre interested in becoming a web developer, JavaScript is one of the best coding languages you can learn. Getting aware later than JavaScript basics means using those skills to build JavaScript projects. Luckily, we know some fun JavaScript sample projects and beginner projects you can do to hone your skills. gone MagicWall – Responsive Image Grid

If youre upon the announce for JavaScript practice projects, weve put together a list of mare than 1200 JavaScript project ideas you can start dynamic upon right now (whether youre looking for JavaScript projects for beginners, intermediate coders, or more innovative coders).
Choose from over 1,200 JavaScript templates about 3d,clean,creative,fullscreen,gallery,grid,html5,image,minimal,photography,portfolio,professional,responsive,retina,showcase. Explore items created by our global community of independent developers, confident they’re hand-reviewed by us. You can download this javascript script through button below.

Script DemoDownload Script

MagicWall is a jQuery plugin for creating an image grid that cycles through a set of images using attractive animations at a specific time interval. You can use this plugin to create a decorative element of your website, display your work or simply use it as a nice animated background.
MagicWall plugin converts a list of images into a grid with defined number of rows and columns. The remaining images will appear with different animations and delays.
You can also configure the plugin in order to define how the grid should be laid out for different screen widths.

Updates

PLEASE NOTE

Update (v 2.0.0) is not backward compatible, you might need to alter your current configuration (Please read below).

• Update ver 2.0.4 (28/10/2014)

1. Fixed a minor bug in the ‘switchItem’ API method.

• Update ver 2.0.3 (07/10/2014)

1. Fixed a minor bug in the animation plugin.

• Update ver 2.0.1 (19/08/2014)

1. Fixed a minor bug in the animation plugin.

• Update ver 2.0.0 (22/06/2014)

1. A few bugs were fixed.
2. Added support for an ajax source.
3. Added social network integration. (Flickr, 500px and Instagram)
4. Changed behavior of breakpoints option. The option is still set the same old way, but now you are able to provide a complete set of options for each breakpoint instead of just countX and countY.
5. Added ability to select whether the images should be loaded from the cache (if available) or not.
6. Added a new option autoUpdateOnResize to automatically update the grid on window resize.
7. Added two new methods, for appending/removing items to/from the grid.
8. Added more options, namely:
   • service
   • jsonUrl
   • appKey
   • userID
   • photoSetID
   • photoCount
   • photoSize
   • loadingMode
   • paused
   • useCache
   • preloadBeforeSwitch
   • autoUpdateOnResize
9. Changed names of some options, namely:
   • countX is now columnsCount
   • countY is now rowsCount
   • minCountX is now minColumnsCount
   • minCountY is now minRowsCount
   • maxCountX is now maxColumnsCount
   • maxCountY is now maxRowsCount
   • onHoverExclude is now pauseOnHover
   • animationsExcluded is now excludedAnimations
   • sizing is now thumbSizing
10. Changed default values of some options, namely:
    • animations is now *
    • animationsExcluded is now ””
    • delay is now 1000
    • duration is now 600
    • All easings are now false by default and they fallback to easing which is now easeInOutCubic

Features

• Responsive grid
• Social networks integration
• Hardware Accelerated
• Fullwidth layout
• Fullscreen layout
• Highly customizable
• 22 Animations
• Sass files included
• Small file size

List of options

• animations
• excludedAnimations
• delay
• maxItemWidth
• maxItemHeight
• breakpoints
• columnsCount
• rowsCount
• minColumnsCount
• minRowsCount
• maxColumnsCount
• maxRowsCount
• pauseOnHover
• thumbSizing
• fixedClass
• perspective
• duration
• easing
• rollInXDuration
• rollInXEasing
• rollInYDuration
• rollInYEasing
• rollOutXDuration
• rollOutXEasing
• rollOutYDuration
• rollOutYEasing
• flipXDuration
• flipXEasing
• flipYDuration
• flipYEasing
• slideXDuration
• slideXEasing
• slideYDuration
• slideYEasing
• slideRowDuration
• slideRowEasing
• slideColumnDuration
• slideColumnEasing
• fadeDuration
• fadeEasing

Script DemoDownload Script

3d,clean,creative,fullscreen,gallery,grid,html5,image,minimal,photography,portfolio,professional,responsive,retina,showcase