/ best free open source web resources /


How to Create Beautiful Photosets with jQuery & CSS

Posted · Category: Gallery, License Free

Terry Mun has shared an tutorial for Creating Beautiful Photosets with jQuery and CSS. It fits into a fluid width layout. It is fully customisable, such that one can dictate the layout as desired, preferably in a straight forward, fuss-free manner.

All images fit snugly into a single row, but their widths are adjusted accordingly so that all images on the same row fill the entire width, not more and not less, of its parent container, while preserving their individual aspect ratios.


Requirements: jQuery and CSS
Demo: https://medium.com/coding-design/7742e6f93d9e
License: License Free

How to Create a Justified Gallery with jQuery

Posted · Category: CC License, Gallery

Justified Gallery is a jQuery plugin that allows you to create a high quality justified gallery of images. Fill all the spaces. It automatically align images to a justified gallery keeping their original aspect ratio.

The plugin is based on the concept that you have various thumbnails for a single image. In fact, you can configure the gallery to show your images in different sizes, and also the plugin may decide to resize some images to fill the remaining empty space. Hence, the plugin needs thumbnails with different sizes to guarantee high quality pictures.


Requirements: jQuery Framework
Demo: http://miromannino.com/projects/justified-gallery/
License: Creative Commons License

How to Create Fancy Animations for Thumbnail Grids

Posted · Category: Gallery, License Free

Today Codrops has shared some fancy Animations for Thumbnails in a Grid with us. There are many possibilities when it comes to these kind of effects, but not all of them fit well when applied to multiple items, like a grid of images. There is not much space and we have to consider the stacking order of the items for the effects to look nice. An interesting thing is that we can play with delays, intensifying the viewing pleasure of the whole thing. Not only can we apply the delays in order, but randomly or reversed.


Requirements: CSS
Demo: http://tympanus.net/Development/ThumbnailGridAnimations/
License: License Free

Glide.js: Responsive & Touch Friendly jQuery Slider

Posted · Category: Gallery, MIT License

Glide.js is responsive and touch-friendly jQuery slider. Based on CSS3 transitions with fallback to older broswers. It’s simple, lightweight and fast. Designed to slide, no less, no more.

It works on smartphones, tablets and desktops. It supports Swipe event, Arrows and bullets navigation, Keyboard navigation, Public API with callbacks, Autoplay and Pause on hover. It is released under MIT License.


Requirements: jQuery Framework
Demo: http://jedrzejchalubek.com/glide/
License: MIT License

jQuery Content Slider with a Hashtag

Posted · Category: Gallery

Hashslider v2 is a jquery-based slider that does what the most jquery-sliders do, but adds a hashtag to the window location, so you can link to any content / position of the slider.

The content can now be loaded from an extern .html-file what makes the performance much better, even when you have dozen of slides. The slider also works now in a “loop”. The hashslider v2 is released under the DBAD public license.


Requirements: jQuery Framework
Demo: http://mhuegel.de/lab/hashslider/
License: DBAD Public License

A Responsive jQuery Gallery with CSS3 Animations

Posted · Category: CC License, Gallery

S Gallery is a Responsive jQuery Gallery Plugin with CSS3 Animations. It makes use of HTML5’s FullScreen API, and relies heavily on CSS3 animations goodness and CSS3 transforms, so it will work only in browsers that support these features.

It has a neat feature: exiting the slideshow mode back to the grid view mode, the last image which was active in the slideshow mode “returns back” to its position in the grid view, thus the user knows where they have stopped and what images are left in the gallery that they haven’t maybe browsed. This is a neat feature which serves as a brain cue and thus is a nice and positive UX-aware touch.


Requirements: jQuery or Zepto Framework
Demo: http://sarasoueidan.com/blog/s-gallery-responsive-jquery-gallery…
License: Creative-Commons Attribution Non-Commercial License

Beautiful Animated Filtering & Sorting Ordered Content

Posted · Category: CC License, Gallery

MixItUp is a light-weight but powerful jQuery plugin that provides beautiful animated filtering and sorting of categorized and ordered content. It plays nice with your existing HTML and CSS, making it a great choice for fluid, responsive layouts. It’s perfect for portfolios, galleries, blogs, or any categorized or ordered content.

MixItUp uses jQuery to decide which elements to hide, show or re-position based on your filters, and then applies the power of CSS3 transitions to smoothly animate these elements to their new locations. MixItUp is optimized for the current generation of modern, CSS3-ready browsers. Due to its light-weight and efficient approach, It works beautifully and smoothly on all modern devices including smartphones and tablets.


Requirements: jQuery Framework
Demo: http://mixitup.io/
License: Creative Commons 3.0 License

Tiny Responsive jQuery Slider without Fancy Effects

Posted · Category: Gallery, License Free

Unslider is the jQuery slider that just slides. No fancy effects or unnecessary markup, and it’s less than 3kb. It’s fluid, flexible, fantastically minimal. Unslider’s been tested in all the latest browsers, and it falls back magnificently for the not-so-latest ones.

If you want to, you can add keyboard arrow support. Not all slides are created equal, and Unslider knows it. It’ll stylishly transition heights with no extra code. You’ll be hard pressed to find a site that’s not responsive these days. Unslider’s got your back. It’s totally responsive.


Requirements: jQuery Framework
Demo: http://unslider.com/
License: License Free

Arrange Images into Flexible Grid with Photoset Grid

Posted · Category: Gallery, License Free

Photoset Grid is a simple jQuery plugin to arrange images into a flexible grid, based on Tumblr’s photoset feature. Originally the plugin was created for the Style Hatch Tumblr themes as a way to use the photoset grid in responsive layouts, but they have since expanded it and released a jQuery plugin for us.

Beyond the basic usage, you can set a number of optional arguments including callback functions that are useful for adding a lightbox for high resolution images. You can download Photoset Grid jQuery plugin on Github.


Requirements: jQuery Framework
Demo: http://stylehatch.github.com/photoset-grid/
License: License Free

Swipebox: A Touchable Lightbox jQuery Plugin

Posted · Category: Gallery, MIT License

Swipebox is a touchable jQuery lightbox. It is a jQuery “lightbox” plugin for desktop, mobile and tablet. It supports Swipe gestures for mobile, Keyboard Navigation for desktop, CSS transitions with jQuery fallback, Retina support for UI icons, and Easy CSS customization.

It has been tested on Chrome, Safari, Firefox, Opera, IE8+, IOS4+, Android, windows phone. It is released under MIT License.


Requirements: jQuery Framework
Demo: http://brutaldesign.github.com/swipebox/
License: MIT License

Page 3 of 15«123456789»...
Supported By


Web Browsers Icon Set
Food Icon Set
Flat Icon Set

Flat Icon Set

100 icons