slimbox 2 group error

**Milamber** · 11-15-2009, 08:07 PM

Hello my slim box install seems to be having a small problem. When i
do a single image display there is no issue but. I have a large number
of images i am lioading in a recursive gallery that will only shopw
half of the image when you have the mouse over it when the mouse is
not over the slimbox at all the image is simply black. This obviously
has something to do with the bounding box for the next and prev
buttons. When the area is active i see all of that half of the image
but not the other half. Also when it is the first or last image in the
site it does not black out the side that doesnot have an overlay on
it. I have tried background transparent in the css. Following below is
the page code and the link to where it displays. Very elegant i think
how it grabs the entire list of images from the matching thmb dir and
images directory linking them together

Code snippet yes using php:

Code:

<html>
<head>
<title>RK Concept &amp; Design</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
<link href="/css/cnd.css" rel="stylesheet" type="text/css">
<script src="menuscript.js" language="javascript" type="text/
javascript"></script>
<link rel="stylesheet" type="text/css" href="/css/menustyle.css"
media="screen, print" />
<script type="text/javascript" src="js/mootools.js"></script>
<script type="text/javascript" src="js/slimbox.js"></script>
<link rel="stylesheet" href="/css/slimbox.css" type="text/css"
media="screen" />
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_reloadPage(init) {  //reloads the window if Nav4 resized
  if (init==true) with (navigator) {if ((appName=="Netscape")&&
(parseInt(appVersion)==4)) {
    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight;
onresize=MM_reloadPage; }}
  else if (innerWidth!=document.MM_pgW || innerHeight!
=document.MM_pgH) location.reload();
}

MM_reloadPage(true);
//-->
</script>
</head>

<body>

<?php include("top.php");?>

<?php include("nav.php");?>

<div id="coredata" style="position:absolute; width:670px; height:
400px; z-index:2; left: 135px; top: 110px; overflow: auto;">
<?php
$d_thmb = dir("gallery/cats/thmb/");
$d_main = dir("gallery/cats/images/");
$index = 0;
echo ("Path: " . $d->path . "<br>\n");
echo ("<table border='1'>\n<tr>\n");
while (false !== ($entry = $d_thmb->read()) && false !==($full =
$d_main->read())) {
   if ( $entry=="." || $entry=="..") { continue;}
   if ( $index == 5) {
      echo ("</tr>\n<tr>\n");
          $index = 0;
          }
   echo ("<td align='center'><a href='".$d_main->path.$full."'
rel='lightbox[cats]' title='".$full."'><img src='".$d_thmb->path.
$entry."'></a><br>".$full."</td>\n");
   $index++;
}

echo ("</tr>\n</table>");
$d->close();
?>

</div>
</body>
</html>

URL: http://cnd.robertkay.net/galtest.php

also there are three css attached to the site here is the contents of
all of them

Main site control css:

Code:

body {
        background-color: #660000;
        font-family: "Times New Roman", Times, serif;
        font-size: 14px;
        font-weight: bold;
        color: #FFFFFF;

}

a:link, a:visited, a:hover, a:active {
        font-family: "Times New Roman", Times, serif;
        font-size: 12px;
        font-weight: bold;
        color: #FFFFFF;
        background-color: #111111;
}

.imagelink a:link, .imagelink a:visited, .imagelink
a:hover, .imagelink a:active{
        background-color: none;
}

input {
        font-family: Georgia, "Times New Roman", Times, serif;
        font-size: 11px;
        line-height: 13px;
        font-weight: bold;
        font-variant: small-caps;
        color: #FFFFFF;
        background-color: #000000;
        border: thin outset #FF9900;

}

textarea {
        font-size: 12px;
        line-height: 13px;
        font-variant: small-caps;
        color: #FFFFFF;
        background-color: #000000;
        border: thin outset #FF9900;
}

.inlineul {
        font-family: "Times New Roman", Times, serif;
        font-size: 12px;
        line-height: 16px;
        font-weight: bold;
        text-transform: uppercase;
        color: #FF9900;
        text-decoration: none;
        background-color: #000000;
        font-style: normal;
        border: medium inset #FFCC00;
        margin: 2px;
        padding: 2px;
        height: auto;
        width: auto;
}

.inlineli {

        font-family: "Times New Roman", Times, serif;
        font-size: 12px;
        line-height: 16px;
        font-weight: bold;
        text-transform: uppercase;
        color: #000000;
        text-decoration: none;
        background-color: #FF9900;
        font-style: normal;
        border: medium inset #FFCC00;
        margin: 2px;
        padding: 2px;
        height: auto;
        width: 200px;
}

.pricespan {
        font-family: Georgia, "Times New Roman", Times, serif;
        font-size: 14px;
        line-height: 16px;
        font-weight: normal;
        font-variant: small-caps;
        color: #FFFF00;
        background-color: #000000;
        margin: 2px;
        padding: 2px;
        height: auto;
        width: auto;
        border: thin solid #FF9900;
}

select {

        font-family: Georgia, "Times New Roman", Times, serif;
        font-size: 11px;
        line-height: 13px;
        font-weight: bold;
        font-variant: small-caps;
        color: #FFFFFF;
        background-color: #000000;
        border: thin outset #FF9900;

}

Navigation Submenu control CSS

Code:

.dropmenu {
   position: absolute;
   left: -1500px;
   visibility: visible;
   z-index: 101;
   float: left;
   width: 152px;

   border-width: 1px;
   border-style: solid;
   border-color: #FFA855;
   background-color: #CC0000;
}

.dropmenu ul {
   margin: 0;
   padding: 0;
   list-style-type: none;
}

.dropmenu li {
   display: inline;
}

.dropmenu a, .dropmenu a:visited, .dropmenu a:active {
   display: block;
   width: 150px;

   padding: 1px;
   margin: 1px;
   font-family: Cursive;
   font-size: 12px;
   font-weight: bold;
   text-align: center;
   text-decoration: none;

   color: #FF9900;
   background-color: #000000;
}

.dropmenu a:hover {
   padding: 1px;
   margin: 1px;
   font-family: Cursive;
   font-size: 13px;
   font-weight: bolder;
   text-align: center;
   text-decoration: none;

   color: #000000;
   background-color: #FF9900;

}

Slimbox CSS:

Code:

/* SLIMBOX */

#lbOverlay {
        position: fixed;
        z-index: 9999;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background-color: #000;
        cursor: pointer;

}

#lbCenter, #lbBottomContainer {
        position: absolute;
        z-index: 9999;
        overflow: hidden;
        background-color: #fff;

}

.lbLoading {
        background: #fff url(loading.gif) no-repeat center;

}

#lbImage {
        position: absolute;
        left: 0;
        top: 0;
        border: 10px solid #fff;
        background-repeat: no-repeat;

}

#lbPrevLink, #lbNextLink {
        display: block;
        position: absolute;
        top: 0;
        width: 50%;
        outline: none;

}

#lbPrevLink {
        left: 0;

}

#lbPrevLink:hover {
        background: transparent url(prevlabel.gif) no-repeat 0 15%;

}

#lbNextLink {
        right: 0;

}

#lbNextLink:hover {
        background: transparent url(nextlabel.gif) no-repeat 100% 15%;

}

#lbBottom {
        font-family: Verdana, Arial, Geneva, Helvetica, sans-serif;
        font-size: 10px;
        color: #666;
        line-height: 1.4em;
        text-align: left;
        border: 10px solid #fff;
        border-top-style: none;

}

#lbCloseLink {
        display: block;
        float: right;
        width: 66px;
        height: 22px;
        background: transparent url(closelabel.gif) no-repeat center;
        margin: 5px 0;
        outline: none;

}

#lbCaption, #lbNumber {
        margin-right: 71px;

}

#lbCaption {
        font-weight: bold;

}

none of them seem to have conflicts but i could be crazy. Hard for me
to follow the condensed version that slimbox.js is displayed in with all
the code collapsed together but it could just be a missing image file. Any help would be hugely appreciated

**Milamber** · 11-15-2009, 09:04 PM

Problem found residing in my main css file with the link handling i had listed will be redefining them

Thread: slimbox 2 group error

Thread Tools

Search Thread

slimbox 2 group error

Bookmarks

Bookmarks

Posting Permissions