MySlimbox
I already posted a Lightbox variation in one of my previous posts, but I got some feedback that the layout wasn't perfect on IE 5 and 6. I found Slimbox, a clone of Lightbox using Mootools, I think it's better because it is a lot lighter and the animations are smoother. My variation of the Slimbox (checkout the demo), has a lighter overlay, and the navigation buttons are always visible at the bottom of the image with the caption centred between them. The close button is in the top right hand corner, which is more similar to how a interface window behaves. This is only a small variation of already brilliant code originally made by Lokesh Dakar, and then modified by Cristophe Beyls to work with Mootools. You can use my version for free in any of your projects.
| Attachment | (click to download) |
|---|---|
 | myslimbox.zip |
is there a simple way to move the arrows together and...
...make the text itself left justified (like the traditional Slimbox) as well as have the big "X" visible only on mouseover?
Great script! Just curious are there any way to make changes...
go to the slimbox.css file
go to the slimbox.css file in the styles folder:
move the arrows:
go to the #lbPrevLink selector and change
left: 0;for
left: 100px;text left justified:
go to the #lbCaption, #lbNumber selector and remove this line
text-align:center;having the x visible on mouseover only:
go to the #lbCloseLink selector and remove this line
background: #fff url(close.gif) no-repeat center;love it - autoplay possible?
hey,
slimbox looks fantastic, and very close to what i'm looking for. i wonder if you've considered some functionality to make it an autoplay slideshow?
or maybe you know of another module that would do something similar. what i'm hoping to find (i'm not good enough to create it myself) is something that will take any image gallery and give the user the option to view the images as a slideshow, and still display the title/description info the way slimbox does.
thanks!
colin
great idea!
Ive been working on improving MySlimbox, when I have more time I'm gonna preload the hover images in the JavaScript, and your idea sounds really good. I'll work on having a feature similar to what you mention. I don't know if you are familiar with TripTracker (http://slideshow.triptracker.net/), but it's a fantastic slideshow script.
When you mention module, are you using a CMS? I have been exchanging e-mails with the developer of the Lightbox module for Drupal. Her name is Stella and she really liked MySlimbox, so now there is an option in this module to have a layout that is very similar to MySlimbox. Here is the adress of the module for anyone using Drupal: http://drupal.org/project/lightbox2
Click Photo to Close
Hello Nicolas,
I have been looking through the slimbox forums and found the link to this page.
I really like your MySlimbox - very very nice - and I love the roller blading pics in your demo - they are sweet.
I would like to use it in a site (where space is at a premium) with Slimbox working in an "inline" manner - with the thumbnails located in an iframe. When a thumbnail is clicked, the full size images / overlay opens within the iframe rather than over the whole page so it looks like its just opening in a div. I have got this working with the original Slimbox really nicely.
I need a couple of mods due to the space constraints as there is no room for #lbBottom with the close button etc under the photos (I have more width than height to play with):
1. click the full size photo to close (with no close button) (as well as on clicking overlay to close).
2. move the next and previous hover function from #lbBottom area to the very left and the very right of the photo and permanently display as relavent (rather than below the photo in the #lbBottom area) - (eg previous button to 30px left of the photo and show whenever a previous image exists and next button to 30px right of the photo and show whenever a next image exists).
Any code snippets / suggestions would be greatly appreciated as I am a css designer not a js coder.
Thank you in advance Nicolas.
Nice plugin :) However,
Nice plugin :)
However, please note that I did not use Lokesh's code. I re-created the code from scratch (even the CSS is very different). Only the visual appearance is the same.
Stay tuned for the new versions of Slimbox that are coming soon.
Opera doesn't show full Background grayed
It can't cover the entire window or document shown.
Post new comment