All Projects → tin-cat → Jquery Mosaic

tin-cat / Jquery Mosaic

Licence: mit
A jQuery plugin to build responsive mosaics of images or any other content fitted to match heights in multiple rows while maintaining aspect ratios. http://jquery-mosaic.tin.cat

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to Jquery Mosaic

Trip.js
🚀 Trip.js is a plugin that can help you customize a tutorial trip easily with more flexibilities.
Stars: ✭ 789 (+886.25%)
Mutual labels:  jquery-plugin, jquery, javascript-library
Jcanvas
A jQuery plugin that makes the HTML5 canvas easy to work with.
Stars: ✭ 612 (+665%)
Mutual labels:  jquery-plugin, jquery, javascript-library
Hummingbird Treeview
A powerful and fast jQuery treeview plugin
Stars: ✭ 50 (-37.5%)
Mutual labels:  jquery-plugin, jquery
Imgviewer
jQuery plugin to zoom and pan images, even those with a size that is a percentage of their container
Stars: ✭ 50 (-37.5%)
Mutual labels:  jquery-plugin, jquery
Tag Handler
Tag Handler is a jQuery plugin used for managing tag-type metadata.
Stars: ✭ 76 (-5%)
Mutual labels:  jquery-plugin, javascript-library
Uploader
A lightweight and very configurable jQuery plugin for file uploading using ajax(a sync); includes support for queues, progress tracking and drag and drop.
Stars: ✭ 1,042 (+1202.5%)
Mutual labels:  jquery-plugin, jquery
Cropper
⚠️ [Deprecated] No longer maintained, please use https://github.com/fengyuanchen/jquery-cropper
Stars: ✭ 7,825 (+9681.25%)
Mutual labels:  jquery-plugin, jquery
Jquery Circle Progress
jQuery Plugin to draw animated circular progress bars
Stars: ✭ 1,065 (+1231.25%)
Mutual labels:  jquery-plugin, jquery
Viewer
⚠️ [Deprecated] No longer maintained, please use https://github.com/fengyuanchen/jquery-viewer
Stars: ✭ 985 (+1131.25%)
Mutual labels:  jquery-plugin, jquery
Applozic Web Plugin
Javascript (jQuery) Real Time Chat & Messaging plugin
Stars: ✭ 76 (-5%)
Mutual labels:  jquery-plugin, jquery
Cmd Resume
Web-based Command Line Resume
Stars: ✭ 55 (-31.25%)
Mutual labels:  jquery-plugin, jquery
Jtap
Tap Event for jQuery
Stars: ✭ 65 (-18.75%)
Mutual labels:  jquery-plugin, jquery
Swiftype Search Jquery
Elastic Site Search jQuery search plugin
Stars: ✭ 74 (-7.5%)
Mutual labels:  jquery-plugin, jquery
Elastic Columns
A jQuery plugin designed to be used as an alternative to the well-known Isotope library.
Stars: ✭ 39 (-51.25%)
Mutual labels:  jquery-plugin, jquery
Jquery.toaster
jQuery plugin for displaying customizable toast notifications via Bootstrap alerts
Stars: ✭ 74 (-7.5%)
Mutual labels:  jquery-plugin, jquery
Bootstrap Show Modal
A Bootstrap 4 / jQuery plugin wrapper, to create modals dynamically in JavaScript
Stars: ✭ 38 (-52.5%)
Mutual labels:  jquery-plugin, jquery
Jcslider
🏂 A responsive slider jQuery plugin with CSS animations
Stars: ✭ 52 (-35%)
Mutual labels:  jquery-plugin, jquery
Jalert
jQuery alert/modal/lightbox plugin
Stars: ✭ 73 (-8.75%)
Mutual labels:  jquery-plugin, jquery
Jquery.lazy
A lightweight, fast, feature-rich, powerful and highly configurable delayed content, image and background lazy loading plugin for jQuery & Zepto.
Stars: ✭ 965 (+1106.25%)
Mutual labels:  jquery-plugin, jquery
Jquery.tabslideout.js
jQuery plugin to create a side/top/bottom tab that slides out to show a feedback form, contact form, notepad etc.
Stars: ✭ 35 (-56.25%)
Mutual labels:  jquery-plugin, jquery

jquery-mosaic

See documentation and working examples on http://jquery-mosaic.tin.cat

A jQuery plugin by Tin.cat that builds responsive mosaics of images or any other content fitted to match heights in multiple rows while maintaining aspect ratios.

jQuery Mosaic screenshot

Works wonderfully with images by creating a visually ordered and pleasant mosaic (much like mosaics on Flickr, 500px and Google+) without gaps between elements, but at the same time respecting aspect ratios. Reacts to window resizes and adapts responsively to any screen size.

Version history

  • v0.15.3 Added maxRows option for those situations where you need fine control on the maximum number of rows of your mosaic. Added advanced options maxItemsToShowWhenResponsiveThresholdSurpassed and showTailWhenNotEnoughItemsForEvenOneRow for even more fine-grained control of your mosaic. Mosaic is not resized when it's hidden and support for VIDEO elements thanks to @borekl
  • v0.15 Added the ability to pass parameters as html data-* attributes. Solved floating point width bug for compatibility with jQuery versions < 3. Thanks to @BenTalagan.
  • v0.14 New maxRowHeightPolicy 'tail' that renders items respecting their aspect ratio without surpassing the specified maxRowHeight, resulting in a last row that might not completely fit the screen horizontally, suggested by @borekl and @nzjrs.
  • v0.13 New outerMargin and innerGap parameters.

Compatibility

  • Requires at least jQuery version 3.3.0
  • Tested successfully on Safari 11.1, Chrome 65.0.3325.181 and Firefox 59.0.2

For programmers and contributors

uglifyjs jquery.mosaic.js -c -m -o jquery.mosaic.min.js
cleancss -o jquery.mosaic.min.css jquery.mosaic.css

Sites using jQuery Mosaic:

License

jQuery Mosaic is released under the MIT License, meaning you can do with it whatever you want, even for commercial and obscure purposes. A credit somewhere would be appreciated, though!

Please

Please don't use jQuery Mosaic to show photos of animal abuse. Seriously.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].