mooCicle
Allora, ho creato un piccolo javascript per creare una semplicissima galleria con effetto foto sfogliate. Avevo notato una galleria di questo genere fatta con jQuery, è mi sono chiesto quanto fosse difficile crearla per mooTools. Direi non molto.

jqGalViewIII (proof of concept)
A photo gallery by jQery, display the thumb image and splendid effect.

Live Thumbnail
Make pictures zoom in/out by a simple mouse click.

(E)2 Photo Gallery
(E)2 Photo Gallery is a open source gallery built with Mootools Javascript Library the compact, modular, Object-Oriented javascript framework. Designed to allow you to upload your photos to a desired folder, tell the (E)2 Photo Gallery what folder to look at and it will automatically load the images using PHP.

AJAX Slide Show
The Slide Show is a simple to use application of the Google AJAX Feed API that is designed to let you add photo slide shows to your pages, sites, and blogs. The slide show control takes photo feeds from all popular sites, such as PhotoBucket, Flickr, and Picasa Web Albums. Any feeds that use Media RSS can be used without customization. However, the slide show control allows any photo-based feed to be accomodated, such as iTunes feeds similar to those found in the Tune Bar solution or the custom feed example below.

jQuery Cycle Plugin
The jQuery Cycle Plugin is a lightweight slideshow plugin. Its implementation is based on the InnerFade Plugin by Torsten Baldes, the Slideshow Plugin by Matt Oakes, and the jqShuffle Plugin by Benjamin Sterling. It supports pause-on-hover, auto-stop, auto-fit, before/after callbacks, click triggers and many transition effects. It also supports, but does not require, the Metadata Plugin and the Easing Plugin

FlickrShow - Simple Javascript Slideshows
Flickrshow is a lightweight, cross-browser javascript slideshow, providing you with an easy way to display your Flickr images on your own website. It is simple to install and can be used to access images within Flickr groups or photosets, or using a tag-based search. The demonstration below is retrieving images from the Twenty Five photset by the very talented Limonada.

slideViewer
slideViewer is a lightweight (1.5Kb) jQuery plugin wich allows to instantly create an image gallery by writing just few lines of HTML such as an unordered list of images

noobSlide - mootools
noobSlide es una ligera "clase" escrita con la librería mootools con la que se puede construir "slides" desde simples hasta complejos, claro que para sacarle el máximo provecho necesitas aprender cómo trabajar con mootools.

Suckerfish HoverLightbox Redux
The Redux has a number of improvements, mostly visual, but some behavioral changes as well. Before going into detail, it's important to give due credit to those who helped make the Suckerfish HoverLightbox a possibility.

ThickBox 2.1.1
ThickBox is a webpage UI dialog widget written in JavaScript on top of the jQuery library. Its function is to show a single image, multiple images, inline content, iframed content, or content served through AJAX in a hybrid modal.

CSS-Based Image Galleries

1. A Photograph Gallery
   Just a simple :hover over thumbnail images to give a full size view of each photograph. With all but Opera you can also click the thumbnails to retain the image on the screen. Text can be added at the bottom of each picture. Ideal for photograph albums.
   
2. A simple CSS photo-album
   The text numbers and images are held in an unordered list without any extra markup (no ‘ems' or 'spans' etc). The CSS just styles the text numbers so that they appears in a box and the images so that they are hidden until your visitor clicks a number square.
   
3. Cross Browser Multi-Page Photograph Gallery
   Based on Suckerfish HoverLightbox this one uses my multi-page layout system but includes images instead of text. Unlike the Suckerfish HoverLightbox this version is pure CSS.
   
4. CSS Image Gallery
   This is a purely CSS based image gallery that displays larger versions of thumbnail images dynamically when the mouse hovers over them. A rich HTML caption can be added to the enlarged image, and every aspect of the Image Gallery exists as plain HTML on the page. The idea is to use CSS's “:hover” pseudo class to cause an element to react onMouseover. When that happens, an absolutely positioned container holding the enlarged image, anchored on the page by another container with position set to relative, is shown. Furthermore, it's possible to modify the behavior so the enlarged images are only shown onClick, though IE6 currently doesn't support this behavior well. The gallery works in IE6+, Firefox, Opera 8+.
   
5. CSS: Photo Showcase
   This experiment uses CSS and basic markup to create a simple way to display photo thumbnails on your site while offering convenient fast zoom viewing, even for dialup users.
   
6. Hoverbox Image Gallery
   Basically, it's a super light-weight (8kb) roll-over photo gallery that uses nothing but CSS.
   
7. Photo scroll gallery
   A combination of several of my previous galleries to give a scrolling ‘thumbnail' image, a medium size image on hover and a full size image on click. The thumbnail, medium size and full size images are all the same image just resized using CSS. The thumbnails are square to make the scrolling area simpler to work with. This does make these images a little distorted but not so much that they look wrong.
   
8. Sliding Photograph Galleries
   It is just an unordered list of images that are normally compressed vertically (reduction 8:1). When you hover over one of these compressed images it expands to full size. It is based on my sliding menu system and adapted to use images. No thumbnails are required and all the images are ‘pre-loaded'.This method can be used either vertically, as shown, or horizontally.
   

JavaScript + CSS-based Galleries & DHTML-Galleries

1. xImgGallery - Javascript Image Gallery & Slideshow
   This script implements a Javascript image gallery and slideshow - all in one file.
   
2. easyAlbum
   A DOM photo Gallery solution that is browser friendly, keyboard friendly, bandwidth friendly and more.
   
3. ImageGal
   imagegal is a simple PHP script that will automagically create a JS/CSS/DHTML powered image gallery for you when dropped into a directory containing images. This simple script was inspired by a Jeremy Keith's article on aListApart.com.
   
4. Highslide JS
   Highslide JS is a piece of JavaScript that streamlines the use of thumbnail images on web pages. The library offers these features and advantages: No plugins like Flash or Java required. Popup blockers are no problem. The images expand within the active browser window.
   
5. Satellite
   Satellite is an all in one photo gallery website that takes advantage of Yahoo Flickr's image hosting and management tools. You can upload and manage your images using Flickr and host your portfolio on your own server via Satellite.
   
6. Dhonishow
   Showing Picture Online with Javascript.
   
7. DropProof
   DropProof is a PHP tool for simple image proofing. DropProof is designed to be lightweight and easy to setup. DropProof is released under the MIT license, making it free to download, use, distribute, and modify.
   
8. CSS Photo Shuffler
   A Javascript + CSS replacement for Flash photo fading slideshow. Inspired by Richard Rutter's image fade demonstration.
   

最新評(píng)論