<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <title>FileBot Gallery</title> <link href="gallery.css" rel="stylesheet" type="text/css" media="screen"> <link rel="icon" href="favicon.png" /> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script> <script type="text/javascript" src="jquery.galleria.pack.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('.gallery_demo_unstyled').addClass('gallery_demo'); // adds new class name to maintain degradability $('ul.gallery_demo').galleria({ history : true, // activates the history object for bookmarking, back-button etc. clickNext : true, // helper for making the image clickable insert : '#main_image', // the containing selector for our main image onImage : function(image,caption,thumb) { // let's add some image effects for demonstration purposes caption.css('display','none').fadeIn(1000); // fetch the thumbnail container var _li = thumb.parents('li'); // fade out inactive thumbnail _li.siblings().children('img.selected').fadeTo(500,0.3); // fade in active thumbnail thumb.fadeTo('fast',1).addClass('selected'); // add a title for the clickable image image.attr('title','Next image >>'); }, onThumb : function(thumb) { // thumbnail effects goes here // fetch the thumbnail container var _li = thumb.parents('li'); // if thumbnail is active, fade all the way. var _fadeTo = _li.is('.active') ? '1' : '0.3'; // fade in the thumbnail when finnished loading thumb.css({display:'none',opacity:_fadeTo}).fadeIn(1500); // hover effects thumb.hover( function() { thumb.fadeTo('fast',1); }, function() { _li.not('.active').children('img').fadeTo('fast',0.3); } // don't fade out if the parent is active ) } }); }); </script> <script type="text/javascript"> var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-25379256-1']); _gaq.push(['_trackPageview']); (function() { var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); })(); </script> </head> <body> <h1>FileBot Gallery</h1> <div class="demo"> <div id="main_image"></div> <ul class="gallery_demo_unstyled"> <li><a href="screenshots/original/panel.rename.png" title="Rename episodes"><img src="screenshots/thumb/panel.rename.png" /></a></li> <li><a href="screenshots/original/dialog.format.png" title="Define your own episode format"><img src="screenshots/thumb/dialog.format.png" /></a></li> <li><a href="screenshots/original/dialog.format.bindings.png" title="Use any kind of media info for your episode format"><img src="screenshots/thumb/dialog.format.bindings.png" /></a></li> <li><a href="screenshots/original/dialog.rename.history.png" title="Reverse rename files using internal history"><img src="screenshots/thumb/dialog.rename.history.png" /></a></li> <li><a href="screenshots/original/panel.episodes.png" title="Fetch list of episodes"><img src="screenshots/thumb/panel.episodes.png" /></a></li> <li><a href="screenshots/original/panel.subtitle.png" title="Download subtitles"><img src="screenshots/thumb/panel.subtitle.png" /></a></li> <li><a href="screenshots/original/dialog.subtitle.viewer.png" title="Preview subtitles"><img src="screenshots/thumb/dialog.subtitle.viewer.png" /></a></li> <li><a href="screenshots/original/dialog.subtitle.download.png" title="Find perfectly matching subtitles via hash value"><img src="screenshots/thumb/dialog.subtitle.download.png" /></a></li> <li><a href="screenshots/original/panel.sfv.png" title="Verify sfv, md5 and sha1 files"><img src="screenshots/thumb/panel.sfv.png" /></a></li> </ul> </div> </body> </html>