diff --git a/ui/gallery.html b/ui/gallery.html
index 282f6ede..65cb376b 100755
--- a/ui/gallery.html
+++ b/ui/gallery.html
@@ -27,35 +27,32 @@ ISSUES:
$(document).ready(function() {
$(".image").click(function(e) {
+ var cur = $(this)
+
// switch classes...
- $(this).parents().siblings().children(".image").removeClass("current-image");
- $(this).siblings(".image").removeClass("current-image");
+ cur.parents().siblings().children(".image").removeClass("current-image")
+ cur.siblings(".image").removeClass("current-image")
- $(this).siblings().children(".image").removeClass("current-image");
- $(this).parents().siblings(".ribbon").removeClass("current-ribbon");
+ cur.siblings().children(".image").removeClass("current-image")
+ cur.parents().siblings(".ribbon").removeClass("current-ribbon")
- $(this).addClass("current-image");
- $(this).parents(".ribbon").addClass("current-ribbon");
+ cur.addClass("current-image")
+ cur.parents(".ribbon").addClass("current-ribbon")
- var container = $(this).parents('.container')
- var field = $(this).parents(".field")
- var cur_image = $(this)
+ var container = cur.parents('.container')
+ var field = cur.parents(".field")
- var container_offset = container.offset()
- var image_offset = cur_image.offset()
+ var image_offset = cur.offset()
var field_offset = field.offset()
// center the current image...
- /* XXX this is really jumpy...
- field.animate({
- */
field.css({
- left: field_offset.left - image_offset.left + (container.innerWidth() - cur_image.innerWidth())/2,
- top: field_offset.top - image_offset.top + (container.innerHeight() - cur_image.innerHeight())/2
+ left: field_offset.left - image_offset.left + (container.innerWidth() - cur.innerWidth())/2,
+ top: field_offset.top - image_offset.top + (container.innerHeight() - cur.innerHeight())/2
})
-
+ // XXX do I need this???
e.preventDefault();
});
@@ -101,6 +98,12 @@ function nextImage(){
overflow: visible;
top: 0px;
left: -100px;
+
+ -webkit-transition: all 0.5s ease;
+ -moz-transition: all 0.5s ease;
+ -o-transition: all 0.5s ease;
+ -ms-transition: all 0.5s ease;
+ transition: all 0.5s ease;
}
.ribbon {