Jquery Lightbox [Support thread]

Please some one must know what this problem is... it cant be something i have done wrong as i have done everything i was meant to plus looks like abs007 has the same problem as me.
please help thanks

Hmm i have tried installing it on another site and the same problem. I didnt get the problem with zenlightbox so am assuming there is some slight changes that I will need to make to the coding.

It would be great if anyone who had similar issues could advise of how it was resolved

thanks

can anyone please send me a link for the files as i am unable to download them from the authors home page.
http://eazyecommerce.com/web-templates/zen-cart/modules

thanks

Hi I have temporarily uploaded the files to one of my sites

please download from here

http://www.allabout-twitter.com/1.4.zip

its the latest version that i downloaded under a week ago.

i will remove the file once you have downloaded.

please make a comment that you have successfully downloaded it so that I can remove the .zip file

also if you find any fix to the issue sthat we are having then it would be great if you share it with us

thanks

thanks buddy

Ok its now been deleted

Im not sure if the support for this mod has been closed as its been some time since the developer has posted

hi
thank you for the files i have solved the problem you had please download the files i have patched from http://www.lightinglifestyle.com/images/jquery.zip
now just copy the folder content in /includes/templates/YOURTEMPLATE/jscript/jquery/

overwrite all files
once done let me know ill delete the file
enjoy

Hi Thanks alot for your help however it doesnt allow me to download the file as it asks for a username and password

just out of curiosity what was the issue

thanks

http://www.lightinglifestyle.com/images/jquery.zip

Hi
ive downloaded it and uploaded it as you suggested- the lightbox now shows however it shows above the header

maybe you can have a look

http://zainabscollection.com/index.php?main_page=product_info&cPath=2&products_id=1&zenid=81d9aaa8972b991047321477e7c6ba54

thanks again

what mod are you using for your header
i will need the files to work on it

Hi much apprecited for all your help

If your refering to the horizontal drop down menu then I am using one from the free downloads area

it can be found here

http://www.zen-cart.com/index.php?main_page=product_contrib_info&products_id=479

other then that I have only edited the css and a few other files to get the height of the header
thanks

we

need to change a few values in your includes/templates/YOUR_TEMPLATE/css/stylesheet_header_menu.css.

send me a copy of that
[email protected]

hi im not sure how toget the file over to you so i have copied and pasted it below - hope you dont mind

body {  
	behavior: url(includes/csshover.htc);
	}
	
/*green*/
div#dropMenu li a:hover, div#dropMenu li.submenu li.submenu:hover {color: #990066!important;background:#D5E88F;}


/*blue
div#dropMenu li a:hover, div#dropMenu li.submenu li.submenu:hover, div#dropMenu ul.level2 a:hover {color: #ffffff!important;background:#6C99D9;}
*/ 

/*red 
div#dropMenu li a:hover, div#dropMenu li.submenu li.submenu:hover, div#dropMenu ul.level2 a:hover {color: #ffffff!important;background:#DC262E;}
*/ 

/*grey 
div#dropMenu li a:hover, div#dropMenu li.submenu li.submenu:hover, div#dropMenu ul.level2 a:hover {color: #4f4f4f!important;background:#D5D5D5;}
*/
	
div#dropMenu {
	width:100%;
	margin:0 auto;
    text-align:center;
	z-index:1000;
	position:relative;
	}

div#dropMenu ul {
    margin:0;
	padding:0;
	}
	
div#dropMenu li {
	position:relative;
	list-style:none; 
	margin:0; 
	float:left; 
	line-height:1em;
	width:16.667%;
	*width:16.649%;
	}
	
div#dropMenu ul.level1 {
	width:100%;
	margin:0 auto; 
	text-align:center;
	background:#990066; /*background color of top menu when NOT selected. */
	z-index:1000;
	float:left;
	}

div#dropMenu li a {
	display: block;
	/* Hides from IE5-mac \*/
	height: 1%;
	/* End hide from IE5-mac */ 
	padding: .6em 0; 
	text-decoration: none; 
	text-transform:uppercase; 
	color:#ffffff; 
	text-align:center; 
	border-right:1px solid #ffffff;
	}	
	
div#dropMenu li:hover {}
/*div#dropMenu li.submenu {background: url(../images/dropmenu.gif) 95% 50% no-repeat;} */
div#dropMenu li.submenu:hover {}
div#dropMenu li a.noLine {border:none;}
div#dropMenu>ul a {width: auto;z-index:1000;}
div#dropMenu ul ul {display: none;}
div#dropMenu ul ul li {border-bottom: 1px solid #CCC; width:15em;z-index:1000;}
/*div#dropMenu li.submenu li.submenu {background: url(../images/submenu.gif) 95% 50% no-repeat;} */
div#dropMenu ul.level1 li.submenu:hover ul.level2, 
div#dropMenu ul.level2 li.submenu:hover ul.level3,
div#dropMenu ul.level3 li.submenu:hover ul.level4,
div#dropMenu ul.level4 li.submenu:hover ul.level5,
div#dropMenu ul.level5 li.submenu:hover ul.level6,
div#dropMenu ul.level6 li.submenu:hover ul.level7,
div#dropMenu ul.level7 li.submenu:hover ul.level8 {position: absolute; width: 15em;display:block;z-index:1000;}
div#dropMenu ul.level2 {background:#4f4f4f;z-index:1000;position:absolute;left:0;}
div#dropMenu ul.level3, 
div#dropMenu ul.level4, 
div#dropMenu ul.level5, 
div#dropMenu ul.level6, 
div#dropMenu ul.level7,
div#dropMenu ul.level8{top: 0; left: 15em; background:#4f4f4f}
div#dropMenu ul.level2 a {padding: 0.5em 0 0.5em 0.25em;color: white; text-transform:none;}  /* this is text color on drop-down submenu */
div#dropMenu ul.level2 a:hover {color:#4f4f4f;}

.clearBoth {
	clear:both;
	height:0;
	font-size:0;
	line-height:0;
	}

thanks

body {
behavior: url(includes/csshover.htc);
}

/green/
div#dropMenu li a:hover, div#dropMenu li.submenu li.submenu:hover {color: #990066!important;background:#D5E88F;}

/*blue
div#dropMenu li a:hover, div#dropMenu li.submenu li.submenu:hover, div#dropMenu ul.level2 a:hover {color: #ffffff!important;background:#6C99D9;}
*/

/*red
div#dropMenu li a:hover, div#dropMenu li.submenu li.submenu:hover, div#dropMenu ul.level2 a:hover {color: #ffffff!important;background:#DC262E;}
*/

/*grey
div#dropMenu li a:hover, div#dropMenu li.submenu li.submenu:hover, div#dropMenu ul.level2 a:hover {color: #4f4f4f!important;background:#D5D5D5;}
*/

div#dropMenu {
width:100%;
margin:0 auto;
text-align:center;
z-index:1000;
}

div#dropMenu ul {
margin:0;
padding:0;
}

div#dropMenu li {
position:relative;
list-style:none;
margin:0;
float:left;
line-height:1em;
width:16.667%;
*width:16.649%;
}

div#dropMenu ul.level1 {
width:100%;
margin:0 auto;
text-align:center;
background:#990066; /*background color of top menu when NOT selected. */
z-index:1000;
float:left;
}

div#dropMenu li a {
display: block;
/* Hides from IE5-mac */
height: 1%;
/* End hide from IE5-mac */
padding: .6em 0;
text-decoration: none;
text-transform:uppercase;
color:#ffffff;
text-align:center;
border-right:1px solid #ffffff;
}

div#dropMenu li:hover {}
/*div#dropMenu li.submenu {background: url(../images/dropmenu.gif) 95% 50% no-repeat;} */
div#dropMenu li.submenu:hover {}
div#dropMenu li a.noLine {border:none;}
div#dropMenu>ul a {width: auto;z-index:1000;}
div#dropMenu ul ul {display: none;}
div#dropMenu ul ul li {border-bottom: 1px solid #CCC; width:15em;z-index:1000;}
/*div#dropMenu li.submenu li.submenu {background: url(../images/submenu.gif) 95% 50% no-repeat;} /
div#dropMenu ul.level1 li.submenu:hover ul.level2,
div#dropMenu ul.level2 li.submenu:hover ul.level3,
div#dropMenu ul.level3 li.submenu:hover ul.level4,
div#dropMenu ul.level4 li.submenu:hover ul.level5,
div#dropMenu ul.level5 li.submenu:hover ul.level6,
div#dropMenu ul.level6 li.submenu:hover ul.level7,
div#dropMenu ul.level7 li.submenu:hover ul.level8 {position: absolute; width: 15em;display:block;z-index:1000;}
div#dropMenu ul.level2 {background:#4f4f4f;z-index:1000;position:absolute;left:0;}
div#dropMenu ul.level3,
div#dropMenu ul.level4,
div#dropMenu ul.level5,
div#dropMenu ul.level6,
div#dropMenu ul.level7,
div#dropMenu ul.level8{top: 0; left: 15em; background:#4f4f4f}
div#dropMenu ul.level2 a {padding: 0.5em 0 0.5em 0.25em;color: white; text-transform:none;} / this is text color on drop-down submenu */
div#dropMenu ul.level2 a:hover {color:#4f4f4f;}

.clearBoth {
clear:both;
height:0;
font-size:0;
line-height:0;
}

//
try the above code
and also if still not working for ypu then edit includes/templates/yourtemplate/css/jqlightbox.css

/**

• jQuery lightBox plugin
• This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
• and adapted to me for use like a plugin from jQuery.
• @name jquery-lightbox-0.5.css
• @author Leandro Vieira Pinho - http://leandrovieira.com
• @version 0.5
• @date April 11, 2008
• @category jQuery plugin
• @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com)
• @license CC Attribution-No Derivative Works 2.5 Brazil - http://creativecommons.org/licenses/by-nd/2.5/br/deed.en_US
• @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
  */
  #jquery-overlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 90;
  width: 100%;
  height: 500px;
  }
  #jquery-lightbox {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
  text-align: center;
  line-height: 0;
  }
  #jquery-lightbox a img { border: none; }
  #lightbox-container-image-box {
  position: relative;
  background-color: #fff;
  width: 250px;
  height: 250px;
  margin: 0 auto;
  }
  #lightbox-container-image { padding: 10px; }
  #lightbox-loading {
  position: absolute;
  top: 40%;
  left: 0%;
  height: 25%;
  width: 100%;
  text-align: center;
  line-height: 0;
  }
  #lightbox-nav {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 10;
  }
  #lightbox-container-image-box > #lightbox-nav { left: 0; }
  #lightbox-nav a { outline: none;}
  #lightbox-nav-btnPrev, #lightbox-nav-btnNext {
  width: 49%;
  height: 100%;
  zoom: 1;
  display: block;
  }
  #lightbox-nav-btnPrev {
  left: 0;
  float: left;
  }
  #lightbox-nav-btnNext {
  right: 0;
  float: right;
  }
  #lightbox-container-image-data-box {
  font: 10px Verdana, Helvetica, sans-serif;
  background-color: #fff;
  margin: 0 auto;
  line-height: 1.4em;
  overflow: auto;
  width: 100%;
  padding: 0 10px 0;
  }
  #lightbox-container-image-data {
  padding: 0 10px;
  color: #666;
  }
  #lightbox-container-image-data #lightbox-image-details {
  width: 70%;
  float: left;
  text-align: left;
  }
  #lightbox-image-details-caption { font-weight: bold; }
  #lightbox-image-details-currentNumber {
  display: block;
  clear: left;
  padding-bottom: 1.0em;
  }
  #lightbox-secNav-btnClose {
  width: 66px;
  float: right;
  padding-bottom: 0.7em;
  }

Hi cheers for the reply

I think your gonna hate me.

I went and added tyhe jqzoom module and I think it replaced many of the files. its kind of hard without any instructions - all I knew is that they worked together as they are from the same developer.

Anyway - the zoom affect works great however the lightbox has the same issues again.

I have changed the css for the horizontal menu and also changed the jqlightbox xss file as suggested but the same issue as the one before.

I tried to restore the jquery files you sent to me but then it would interfere with the zoom.

not too sure what to do now

http://zainabscollection.com/index.php?main_page=product_info&cPath=3&products_id=2

the zoom looks nice
how do you plan to manage additional images in this
try using this if you like
http://www.zenflavor.com/lightbox-for-zen-cart.html

ammuch:

http://www.lightinglifestyle.com/images/jquery.zip

Thanks ammuch that worked for me but then i have the same problem as abs007 as when i install jqzoom the problem is back again, am guessing that the changes you made the the jqlightbox files also have to be done to the jqzoom files, as the java script files you changed are over written by jqzoom.

could you make the changes to the jqzoom java files as well?? i have zip all the java files for jqzoom here. http://ebaylistingtemplates.co.uk/jquery.zip

if you could do this it my fix the problem please let em know thanks from Patrick

i need all the files of jzoom

thanks
amit

Hi Ammuch here are the jqzoom files http://ebaylistingtemplates.co.uk/jqzoom.zip thanks