A creative views switch animation with grid and list viewing modes made with CSS3, jQuery, Masonry and GSAP’s TweenMax.
Best jQuery Grid Plugins & Tutorials with Demo
Grid Layout with Motion Hover Effect and Content Preview
Today we’d like to share a little grid layout with you. We use CSS Grid and a playful hover effect on the grid items which are composed of different wildly placed elements. When an item is clicked, we slide in a content preview overlay and animate the grid items out and the preview items in. For the animations we use TweenMax by Greensock.
jQuery – Facebook,YouTube,Vimeo,Twitter,Instagram Social Stream Grid
- Responsive Design Layouts.
- 6 Style Available
- Inline Social read popup
- Inline Only image popup
- Custom Columns Layout
- Custom backgrond Color and hover background color
- Fitrow and Masonry Grid Layout
- Show more Pagination
- Multi Filtering
- Social Share icon for each post in popup
- 60+ animation effects
Grid Loading Animations with JavaScript & CSS
Today we’d like to share a set of simple, inspirational loading animations for grid items with you. The idea is to show some image grid items with a (subtle) animation after loading has finished. For the demo we have three slightly different grid layouts with different gutters and column numbers.
jQuery Responsive Bootstrap Portfolio And Lightbox
A set of responsive Bootstrap Portfolio And Lightbox contains bootstrap portfolio gallery, bootstrap lightbox gallery, bootstrap carousel with thumbnails and also support YouTube videos, vimeo video, self hosted videos etc with new features.
- 18 Light-boxes
- 7 Colors Schemes
- 6 Slider Portfolios
- 18 Simple Portfolios
- Built With Bootstrap 3.x
- 3 Background Colors Schemes
- 2,3,4,5,6 columns grid portfolios
- 100% Responsive And Mobiles friendly
- YouTube, Vimeo and Self hosted Videos Support
Cool CSS Loading Effects for Grid Images
TutsMix has shared with us some cool CSS loading effects for grid images. You can use them on your portfolio, blog, or anywhere you want. The setup is quite simple. We use Normalize.css as an alternative to the traditional CSS reset, ZURB Foundation to create a responsive grid, Masonry to create a dynamic grid layout, imagesLoaded to check if the images have been loaded, and Infinite Scroll by Paul Irish to load more images and append them to the gallery.
