some issues our team found with Section 508 compliance with lightbox2:

RCS file: /www/sites/all/modules/lightbox2/js/lightbox.js,v
retrieving revision 1.1.1.1
diff -u -b -B -r1.1.1.1 lightbox.js
--- lightbox.js 1 Feb 2010 20:47:27 -0000 1.1.1.1
+++ lightbox.js 6 Aug 2010 19:19:41 -0000
@@ -138,7 +138,7 @@
var imageContainer = '

';
var details = '

';
var bottomNav = '

';
- var image = 'Only local images are allowed.';
+ var image = 'Only local images are allowed.';
var hoverNav = '

';
var frameNav = '

';
var caption = '';

Comments

josephcheek’s picture

looks like the diff got stripped. 2nd try:

RCS file: /home/cvs/edgov_redesign/www/sites/all/modules/lightbox2/js/lightbox.js,v
retrieving revision 1.1.1.1
diff -u -b -B -r1.1.1.1 lightbox.js
--- lightbox.js 1 Feb 2010 20:47:27 -0000       1.1.1.1
+++ lightbox.js 6 Aug 2010 19:19:41 -0000
@@ -138,7 +138,7 @@
     var imageContainer = '<div id="imageContainer" style="display: none;"></div>';
     var details = '<div id="imageDetails"></div>';
     var bottomNav = '<div id="bottomNav"></div>';
-    var image = '<img id="lightboxImage" />';
+    var image = '<img id="lightboxImage" alt=""/>';
     var hoverNav = '<div id="hoverNav"><a id="prevLink" href="#"></a><a id="nextLink" href="#"></a></div>';
     var frameNav = '<div id="frameHoverNav"><a id="framePrevLink" href="#"></a><a id="frameNextLink" href="#"></a></div>';
     var caption = '<span id="caption"></span>';
josephcheek’s picture

titles on the navigation elements for lightshow for use with screen readers. lightbox should have the same, but we're only using lightshow, so i didn't change zoom and zoomout.

RCS file: /home/cvs/www/sites/all/modules/lightbox2/js/lightbox.js,v
retrieving revision 1.2
diff -u -b -B -r1.2 lightbox.js
--- lightbox.js 6 Aug 2010 20:03:25 -0000       1.2
+++ lightbox.js 9 Aug 2010 16:07:59 -0000
@@ -1,4 +1,4 @@
-/* $Id: lightbox.js,v 1.2 2010/08/06 20:03:25 jcheek Exp $ */
+/* $Id: lightbox.js,v 1.1.1.1 2010/02/01 20:47:27 jcheek Exp $ */

 /**
  * jQuery Lightbox
@@ -139,15 +139,15 @@
     var details = '<div id="imageDetails"></div>';
     var bottomNav = '<div id="bottomNav"></div>';
     var image = '<img id="lightboxImage" alt=""/>';
-    var hoverNav = '<div id="hoverNav"><a id="prevLink" href="#"></a><a id="nextLink" href="#"></a></div>';
-    var frameNav = '<div id="frameHoverNav"><a id="framePrevLink" href="#"></a><a id="frameNextLink" href="#"></a></div>';
+    var hoverNav = '<div id="hoverNav"><a id="prevLink" title="Previous Image" href="#"></a><a id="nextLink" title="Next Image" href="#"></a></div>';
+    var frameNav = '<div id="frameHoverNav"><a id="framePrevLink" title="Previous Image" href="#"></a><a id="frameNextLink" title="Next Image" href="#"></a></div>';
     var caption = '<span id="caption"></span>';
     var numberDisplay = '<span id="numberDisplay"></span>';
-    var close = '<a id="bottomNavClose" href="#"></a>';
+    var close = '<a id="bottomNavClose" title="Close Slideshow" href="#"></a>';
     var zoom = '<a id="bottomNavZoom" href="#"></a>';
     var zoomOut = '<a id="bottomNavZoomOut" href="#"></a>';
-    var pause = '<a id="lightshowPause" href="#" style="display: none;"></a>';
-    var play = '<a id="lightshowPlay" href="#" style="display: none;"></a>';
+    var pause = '<a id="lightshowPause" title="Pause Slideshow" href="#" style="display: none;"></a>';
+    var play = '<a id="lightshowPlay" title="Play Slideshow" href="#" style="display: none;"></a>';

     $("body").append(output);
     $('#outerImageContainer').append(modal + frame + imageContainer + loading);
stella’s picture

Status: Active » Fixed

Committed with a few changes - changed some of the title text and also made it translatable. Thanks!

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.