Witam w jaki sposób można użyć efektu fade tak aby po kliknięciu na button zniknął stworzony div i pozniej utworzył się kolejny ? W tym momencie mi to nie działa tzn działa ale nie tak jak powinno wyłącza poprostu diva ale nie załącza kolejnego o innym id. Chciałbym, aby okno stworzone o class gallery_container przewijało się gładko a nie tak jak w tym momencie.

[PHP] pobierz, plaintext 
  1. _Lightbox = function(_obW) {
  2.     this.obW = _obW;
  3.     this.div_background = null;
  4.     this.div_container = null;
  5. 	this.div_photos = null;
  6.     this.image = null;
  7.     this.loading = null;
  8.     this.o = this;
  9.  
  10. 	var id = this.obW.id;
  11.  
  12.     this.destroy = function() {
  13.         this.div_background.parentNode.removeChild(this.div_background);
  14.         this.div_container.parentNode.removeChild(this.div_container);
  15. 		this.div_photos.parentNode.removeChild(this.div_photos);
  16.         delete this;
  17.     }
  18.  
  19.     this.init = function() { 
  20. 		var img_href = document.getElementById(id);	
  21.  
  22.         var ob = this.o;
  23. 		var href = img_href;
  24.         var body = document.getElementsByTagName('body')[0];
  25.         this.loading = document.createElement('span');
  26.         this.loading.className = 'gallery_loading';
  27.         this.obW.appendChild(this.loading);
  28.  
  29.         this.image = new Image();
  30.         this.image.onload = function () {
  31.             ob.loading.parentNode.removeChild(ob.loading);
  32.             ob.loading = null;
  33.  
  34.             ob.div_background = document.createElement('div');
  35.             ob.div_background.className = 'gallery_background';
  36.             ob.div_background.style.width = window.innerWidth;
  37.             ob.div_background.style.height = window.innerHeight;
  38.             ob.div_background.title = "Kliknij aby zamknąć";
  39.             ob.div_background.onclick = function() {
  40.                 ob.destroy();
  41.             }
  42.             body.appendChild(ob.div_background);
  43.  
  44.             ob.div_container = document.createElement('div');
  45.             ob.div_container.className = 'gallery_container';
  46. 			ob.div_container.id = 'gallery_container';			
  47. 			ob.div_container.style.width = 92 + '%';
  48. 			ob.div_container.style.marginLeft = -46 + '%';
  49.  
  50.  
  51. 			ob.div_photos = document.createElement('div');
  52.             ob.div_photos.className = 'gallery_photos';
  53. 			ob.div_photos.id = 'gallery_container';
  54.             ob.div_photos.appendChild(ob.image);
  55.  
  56.  
  57.             var btnClose = document.createElement('input');
  58.                 btnClose.type = "button";
  59.                 btnClose.className = "close";
  60.                 btnClose.value = "x";
  61.                 btnClose.onclick = function() {
  62.                     ob.destroy();
  63.                 }
  64.             ob.div_container.appendChild(btnClose);
  65.  
  66. 			var before = document.createElement('input');
  67.                 before.type = "button";
  68.                 before.className = "before";
  69. 				before.id = "before";
  70. 				before.style.marginTop = -30 + 'px';
  71.                 before.value = "<";
  72.                 before.onclick = function() {
  73. 					$("#before").click(function() {
  74. 						$('#gallery_container').fadeToggle(200);
  75. 					});
  76. 					if (id == 0) {
  77.  
  78. 					}
  79. 					else{
  80. 						ob.destroy();
  81. 						id--;
  82. 						ob.init();
  83. 					} 
  84.                 }
  85.             ob.div_container.appendChild(before);
  86.  
  87. 			var next = document.createElement('input');
  88.                 next.type = "button";
  89.                 next.className = "next";
  90. 				next.id = "next";
  91. 				next.style.marginTop = -30 + 'px';
  92.                 next.value = ">";
  93.                 next.onclick = function() {	
  94. 					var i = document.getElementById("gallery").getElementsByTagName("img").length;
  95.  
  96. 					$("#next").click(function() {
  97. 						$('#gallery_container').fadeToggle(200);
  98. 					});
  99.  
  100. 				    if (id == i-1) {
  101.  
  102. 					}
  103. 					else{
  104. 						ob.destroy();
  105. 						id++;
  106. 						ob.init();
  107. 					} 
  108.                 }
  109.             ob.div_container.appendChild(next);
  110.  
  111. 			body.appendChild(ob.div_container);
  112.  
  113. 			ob.div_container.appendChild(ob.div_photos);
  114.         }
  115.         this.image.src = img_href;
  116.     }
  117.     this.init();
  118. }
  119.  
  120. Node.prototype.lightbox = function() {
  121.     if (!(new RegExp('^.+jpg|png|jpeg|gif$', 'gi')).test(this.href)) return
  122.     this.onclick = function() {
  123.         var lighbox = new _Lightbox(this);
  124.         return false;
  125.     }       
  126. }
  127.  
  128. window.onload = function() {
  129.     var a = document.getElementsByTagName('a');
  130.         for (i=0; i<a.length; i++) {
  131.             if (a[i].className == 'gallery_photo') {
  132.                 a[i].lightbox();
  133.             }
  134.         }
  135. }
[PHP] pobierz, plaintext