Chocolat.js - The lightbox so cool horses use it! (chocolat.insipi.de)
over 7 years ago from Gilles Bertaux, CEO @ Livestorm
over 7 years ago from Gilles Bertaux, CEO @ Livestorm
More impressed by the site, really nice!
haha :D Here is a link to the designer website : www.maximechillemi.com
The images here are absolutely mental. I particularly the enjoy the one of a huge bar of chocolate floating in a swimming pool while a horse wearing a towel looks on in awe.
Also, it sucks there's no transition animations out of the box.
I like that there's no animations out of the box – maybe it would be useful to have it as an optional external dependency.
Hi there, I'm the author of the plugin, if you have any question/suggestion please do :)
Nicolas
Do you support swiping on mobile devices? Clicking tiny little arrows on a phone doesn't feel comfortable nowadays.
Hi! unfortunately not yet (but you can easily increase the clickable size of the arrows)
I reccomend Photoswipe if you need advanced touch support, check it out. However it's a bit hard to implement and it may be overkill for most projects.
Great work on chocolat.js btw, seems very easy and lightweight. I'm definitely going to use in a project :)
Loving the website too, I'm a big fan of this 3D style.
hammer.js
Just use PhotoSwipe, it's great. Some say that it's hard, but after you implement it once – it becomes simple.
Wouldn't this be considered a carousel instead of a lightbox?
It depends on if you use it within a container or fullWindow :) It can be a carousel as well as a lightbox, maybe that's the power of chocolat (?)
Why do you animate the margin and top,left,bottom,right positions, instead of transforms? If for no reason, then i would suggest using the transforms properties. It will increase the performance a lot; since it doesn't cause a paint and layout event to occur.
Other than that i really like it and will definitely try it out in a project.
Yep, I kept the positions properties because of older IE compt, but i think now it's time to use CSS transform instead. I will do this soon.
So I'm wondering how the data is loaded into the lightbox. How are you building the lightbox slides? Do you plan on extending the plugin to allow for JSON instead of scraping the page and looking for
I was recently building an Pinterest-Instagram-type clone (used the bluimp gallery, available on github) and I wanted my users to be able to view nth items per page but swipe/scroll through the entire set once a lightbox slide was up. The only way to do this is to load the data in another way.
Do you mind talking a little bit about the javascript you wrote? Design patterns? Is the API going to be extended to allow for JSON? If so I may use this for the next version of my app.
Fuck it, I'll fork it.
good job
Hi, good news, you can actually pass json instead of "dom nodes". See the property images
It takes a collection, like this: [{src:'img1.jpg', title: 'title1'}, {src:'img2.jpg', title: 'title2'}, ..]
More info here : https://github.com/nicolas-t/Chocolat#parameters
The main idea was to keep it really simple for two reasons: new users can use it easily advanced users can improve it with ease.
You seem to be one of the advanced users, you should definitly download the package and take a look at the demos, (dist/index.html) the last example shows you the use of the API, (and json loaded images)
Don't hesitate to open an issue on github if you have any questions.
Nicolas,
One of the best code project landing pages I've ever seen.
The website is incredible.
I'm very confused by all the things that are going on @_@
In my haste, I read that as a jQuery-free lightbox instead of a free jQuery lightbox.
I got really excited for a second, thinking that someone had built something this smooth and lightweight without jQuery.
It's not vanilla.js its chocolat.js
(maybe ported to vanilla one day)
This looks great! The website for it is incredible as well!
This is very nice man. Definitely going to use it soon !
Wow, I don't understand the praise for the website, it might work as a piece of art but it's supposed to be website. It's throwing usability and readability out of the window, there are things happening all over the place for reasons hard to understand (ig: the hover effect on the second slide). It took me at least 10 seconds to understand what I was looking at when I got to the demo. Same for the third slide, the whole website is just really hard to parse.
Damn I find the website / landing page more impressive than the plugin itself. That design is on-point!
See the difference a lot makeup let's take another blocks from Lonny in this call luminous Lizzie that moment very same for us and I’m going to a club that's for it to be couple of months cheap in up my cheap phone this is more of a Subaru blush and it's really going to and a pokémontoo light to my face no powerful delights scalable one that out for my eyes I'm going to do something very simple so I'm going. http://eyeluminousfacts.com/clarity-advanced-eye-treatment/
Which you could downvote stuff on DN as well.
Spam. We need "report as spam".
Designer News
Where the design community meets.
Designer News is a large, global community of people working or interested in design and technology.
Have feedback?
Login to Comment
You'll need to log in before you can leave a comment.
LoginRegister Today
New accounts can leave comments immediately, and gain full permissions after one week.
Register now