@@ -3,22 +3,37 @@ WeeLightbox This is a packaged version of lightbox for viewing images on the screen in the popular lightbox design pattern. -Please refer to the lightbox docs for more info. Included are some rails helpers for easy integration into your site. +Please refer to the lightbox docs for more info. Included are some rails helpers for easy integration into your site. The lightbox javascript is slightly tweaked to configure the location of images and increase the speed of resize. + +You can edit lightbox.js to further tweak these if you wish. Install ======= +If you install from github with rails 2.1+ it will install the files into your public directory. If you install with another method, you may need to issue a recursive copy command manually. +Also this install script is untested on windows. Example ======= In your layout add the following in the head section. -<%= load_lightbox %> If you have not already done so: -<%= javascript_include_tag :defaults %> to load the prototype javascript library beforehand. +<%= javascript_include_tag :defaults %> +<%= yield :page_includes %> + +In your template: + +<%= load_lightbox %> For each image that you would like to make a lightbox to +<%= lightbox_to('/images/small.gif', '/images/large.gif', "Tasty image caption") + +If you want to have more than one lightbox on a page and have the lightbox operate with a slideshow between images.. + +<%= lightbox_to('/images/small.gif', '/images/large.gif', "Tasty image caption", "group_name") + +Where group name needs to be the same for all images in the slideshow. Copyright (c) 2008 Alastair Brunton, released under the MIT license README @@ -49,10 +49,10 @@ LightboxOptions = Object.extend({ fileLoadingImage: '/images/lightbox/loading.gif', fileBottomNavCloseImage: '/images/lightbox/closelabel.gif', - overlayOpacity: 0.8, // controls transparency of shadow overlay + overlayOpacity: 0.9, // controls transparency of shadow overlay animate: true, // toggles resizing animations - resizeSpeed: 7, // controls the speed of the image resizing animations (1=slowest and 10=fastest) + resizeSpeed: 15, // controls the speed of the image resizing animations (1=slowest and 10=fastest) borderSize: 10, //if you adjust the padding in the CSS, you will need to update this variable files/javascripts/lightbox.js c73d5630bb3ada128471af7b4ca5c8bf9d83db21 Alastair Brunton info@simplyexcited.co.uk http://github.com/pyrat/wee_lightbox/commit/5e57da84a25ba1b0d0ccb0a7d859a8a6355be170 5e57da84a25ba1b0d0ccb0a7d859a8a6355be170 2008-08-06T14:33:16-07:00 2008-08-06T14:33:16-07:00 Changes to lightbox js and improvements to README. a053758def7b1257582932721f61d5befc8f1b65 Alastair Brunton info@simplyexcited.co.uk