SHARE
TWEET

ImageGallery

Ortund Dec 1st, 2011 54 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <table width="100%">
  2.     <tr>
  3.         <td style="text-align: left"><a href="#" id="prev"></a></td>
  4.         <td colspan="2"><img class="mainImage" src="Gallery/Images/BB9900pg3.png" alt="" height="500px" /></td>
  5.         <td style="text-align: right"><a href="#" id="next"></a></td>
  6.     </tr>
  7. </table>
  8.            
  9. <table id="thumbs">
  10.     <tr id="row1" style="display: block;">
  11.         <td><a href="#" class="thumb"><img class="thumbimg" src="Gallery/Images/BB9900pg3.png" height="90px" alt="" /></a></td>
  12.     </tr>
  13. </table>
  14.  
  15. $(document).ready(function () {
  16.  
  17.     // #########################
  18.     // ####### GALLERY #########
  19.     // #########################
  20.  
  21.     var mainImage = $('.mainImage');
  22.  
  23.     $('.thumbimg').click(function () {
  24.         var newSrc = $(this).attr('src');
  25.         mainImage.attr('src', newSrc);
  26.         $('#gallery').attr('width', mainImage.attr('width') + '15px');
  27.     });
  28.  
  29.     var i = 1;
  30.     $('#prev').click(function () {
  31.         var row = document.getElementById('row' + i);
  32.         if (row != null) {
  33.             if (row.style.display == 'block') {
  34.                 row.style.display = 'none';
  35.                 document.getElementById('row' + (i - 1)).style.display = 'block';
  36.             };
  37.         }
  38.         else {
  39.             return;
  40.         };
  41.         i = i - 1;
  42.     });
  43.  
  44.     $('#next').click(function () {
  45.         // var row = $('#thumbs').children('#row' + i);
  46.         var row = document.getElementById('row' + i);
  47.         if (row != null) {
  48.             if (row.style.display == 'block') {
  49.                 row.style.display = 'none';
  50.                 document.getElementById('row' + (i + 1)).style.display = 'block';
  51.             };
  52.         }
  53.         else {
  54.             return;
  55.         };
  56.         i = i + 1;
  57.     });
  58.  
  59.  
  60.  
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top