Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Image Object #9

Open
varun-pp opened this issue Feb 16, 2018 · 1 comment
Open

Image Object #9

varun-pp opened this issue Feb 16, 2018 · 1 comment

Comments

@varun-pp
Copy link

Hi,

What are the properties of image object ?
what is url_s, url_n url_m, url_l url_z ?
What if there is only one Url ?

Thanks

@Nex4rius
Copy link

Nex4rius commented Apr 30, 2018

I'm generating an object like this:

alle_bilder = [
    {url:'/storage/uploads/image_1.jpg', width:'1024', height:'768'},
    {url:'/storage/uploads/image_2.jpg', width:'768',  height:'1024'},
    {url:'/storage/uploads/image_3.jpg', width:'651',  height:'437'},
    {url:'/storage/uploads/image_4.jpg', width:'768',  height:'432'},
    {url:'/storage/uploads/image_5.jpg', width:'702',  height:'468'},
    {url:'/storage/uploads/image_6.jpg', width:'702',  height:'468'},
    {url:'/storage/uploads/image_7.jpg', width:'651',  height:'437'},
    {url:'/storage/uploads/image_8.jpg', width:'768',  height:'432'},
];

and in my javascript file I have this

function bildergalerie() {
	$('#justified-plugin-bildergalerie').empty().justifiedImages({
		images : alle_bilder,
		rowHeight: 200,
		maxRowHeight: 300,
		thumbnailPath: function(photo, width, height){
			return photo.url;
		},
		getSize: function(photo){
			return {width: photo.width, height: photo.height};
		},
		margin: 15
	});
}
bildergalerie();

and it works great.

If you want to get it to be responsive too just add this:

$(window).resize(bildergalerie)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants