use page size functions from lightbox.js

finetune CSS

diff --git a/include/gallery.css b/include/gallery.css
index 5778fc05be56e6fdd15aa534ff53a0baecfd3ef6..c9d4b3f2862f5dd71c09eb3e15d9fbaecea7c132 100644 (file)
--- a/include/gallery.css
+++ b/include/gallery.css
@@ -3,14 +3,14 @@ img {
  border-style: inset;
  border-color: gray;
  border-width: 2px;
- margin: 0.3ex;
+ margin: 0.2ex;
 }
 
 table.slide {
  float: left;
  width: 210px;
  height: 210px;
- margin: 0.3ex;
+ margin: 0.2ex;
  border-style: outset;
  border-color: #e0c080;
  border-width: 2px;

diff --git a/include/gallery.js b/include/gallery.js
index 3c2e1f3d2445326ec22164102ca839dcd6b602fb..bf217f378663e45576594c7bdde135584cd896a7 100644 (file)
--- a/include/gallery.js
+++ b/include/gallery.js
@@ -1,28 +1,15 @@
 function showIbox(iboxid) {
  var ibox = document.getElementById(iboxid);
- var wwidth;
- var wheight;
  var bwidth = 400;
  var bheight = 300;
- if (self.innerWidth)
- {
-  wwidth = self.innerWidth;
-  wheight = self.innerHeight;
- }
- else if (document.documentElement && document.documentElement.clientWidth)
- {
-  wwidth = document.documentElement.clientWidth;
-  wheight = document.documentElement.clientHeight;
- }
- else if (document.body)
- {
-  wwidth = document.body.clientWidth;
-  wheight = document.body.clientHeight;
- }
+
+ var arrayPageSize = getPageSize();
+ var arrayPageScroll = getPageScroll();
+
+ ibox.style.top = arrayPageScroll[1] + ((arrayPageSize[3] - bheight) / 2) + 'px';
+ ibox.style.left = ((arrayPageSize[0] - bwidth) / 2) + "px";
  ibox.style.width = bwidth + "px";
  ibox.style.height = bheight + "px";
- ibox.style.left = ((wwidth - bwidth) / 2) + "px";
- ibox.style.top = ((wheight - bheight) / 2) + "px";
  // alert('wwidth='+wwidth+'; bwidth='+bwidth+'; wheight='+wheight+'; bheight='+bheight);
  ibox.zIndex = '0';
  ibox.style.display = 'block';