Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Mar 2010
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Picture viewer is acting funky. Please help!

    I would first like to say that I'm a noob to PHP. The problem that I am having is with my picture viewer. When you click on the thumbs, they show above in the main image viewer. The problem is that it is displaying the thumbnail instead of resizing the original image to fit the main image spot. When you click on the main image, the original pic is to be displayed in a lightbox. How do I go about fixing this issue? Thanks in advance for those who help!

    Code:
    http://conceptsinmotion.net/store/store?page=shop.product_details&flypage=flypage.tpl&product_id=1&category_id=17
    PHP Code:
    <?php if( !defined'_VALID_MOS' ) && !defined'_JEXEC' ) ) die( 'Direct Access to '.basename(__FILE__).' is not allowed.' ); ?>

    <?php echo $buttons_header // The PDF, Email and Print buttons ?>

    <?php
    if( $this->get_cfg'showPathway' )) {
        echo 
    "<div class=\"pathway\">$navigation_pathway</div>";
    }
    if( 
    $this->get_cfg'product_navigation')) {
        if( !empty( 
    $previous_product )) {
            echo 
    '<a class="previous_page" href="'.$previous_product_url.'">'.shopMakeHtmlSafe($previous_product['product_name']).'</a>';
        }
        if( !empty( 
    $next_product )) {        
            echo 
    '<a class="next_page" href="'.$next_product_url.'">'.shopMakeHtmlSafe($next_product['product_name']).'</a>';
        }
    }
    ?>
    <br style="clear:both;" /><center>
    <table border="0" style="width: 100%;margin-left: auto;margin-right: auto;">
      <tbody>
        <tr align="right">
          <td colspan="3" align="center">
          <?php  if( $this->get_cfg('showManufacturerLink') ) { $rowspan 5; } else { $rowspan 4; } ?>
          <div id="parent_img"><?php echo $product_image ?></div>
            <br/><br/>
            <?php if (count($images)): foreach ($images as $image){$curentwidth += $image->file_image_thumb_width;}?>
            <script type="text/javascript">
          iens6=document.all||document.getElementById
          ns4=document.layers
          var speed=5
          </script>
            <div id="scroll" style="margin-left: auto;margin-right: auto;">
          <div class="box-left" style="width: 15px; float: left;margin:10px 0px 0px 0px"><a class="mouseover_left" onmouseover="movedown()" onmouseout="clearTimeout(movedownvar)" href="#"><img src="<?php echo JURI::root().'components/com_virtuemart/themes/vm_black/images/prev.png';?>" alt="" border="0" /></a></div>
          <span class="box-right" style="float: right;margin:10px 0px 0px 0px"><a class="mouseover_right" onmouseover="moveup()" onmouseout="clearTimeout(moveupvar)" href="#"><img src="<?php echo JURI::root().'components/com_virtuemart/themes/vm_black/images/next.png';?>" alt="" border="0" /></a></span>
          <div id="container" style="overflow: hidden; width: 50%; position: relative; height: 55px;float:center">
            <div id="child" style="position: absolute; width: <?php echo $curentwidth;?>px; left: 0pt; top: 0pt;"> <ilayer name="nscontainer"> <layer name="nscontent" visibility="hidden"> <?php echo $this->vmlistAdditionalImages$product_id$images )?> </layer> </ilayer> </div>
          </div>
          <div class="box-right" style="float: right;margin:10px 0px 0px 0px"></div>
          </div>
          <script language="JavaScript1.2">
          if (iens6){
          var crossobj=document.getElementById? document.getElementById("child") : document.all.content
          var contentheight=crossobj.offsetWidth
          }
          else if (ns4){
          var crossobj=document.nscontainer.document.nscontent
          var contentheight=crossobj.clip.width
          
          }
          
          function movedown(){
          if (iens6&&parseInt(crossobj.style.left)>=<?php echo 64*count($images)*(-1)/5-32;?>)
          crossobj.style.left=parseInt(crossobj.style.left)-speed+"px"
          else if (ns4&&crossobj.left>=<?php echo 64*count($images)*(-1)/5-32;?>)
          crossobj.left-=speed
          movedownvar=setTimeout("movedown()",50)
          }
          
          function moveup(){
          if (iens6&&parseInt(crossobj.style.left)<=0)
          crossobj.style.left=parseInt(crossobj.style.left)+speed+"px"
          else if (ns4&&crossobj.left<=0)
          crossobj.left+=speed
          moveupvar=setTimeout("moveup()",50)
          
          }
          
          function getcontent_height(){
          if (iens6)
          contentheight=crossobj.offsetWidth
          else if (ns4)
          document.nscontainer.document.nscontent.visibility="show"
          }
          window.onload=getcontent_height
          </script>
            
         </td>
         <style type="text/css">
              ul.box li{float:left;list-style:none;padding-left:0 !important}
              ul.box{width:100%;margin:0px;padding:0px;}
              li:hover img{opacity:1}
              
          </style>
         
         <script type="text/javascript">
         function show_img(url)
         {
             var output1 = window.document.getElementById('curent').href=url;
             var output2 = window.document.getElementById('img_preview').src=url;
             return true;
             
         }
        
         </script>
         <?php endif;?><br /><br />
          </tr>
        <tr align="right">
          <td rowspan="1" colspan="3" align="right">
          <h1 style="margin-left: auto;margin-right: auto;"><?php echo $product_name ?> <?php echo $edit_link ?></h1>
          </td>
        </tr>
        <?php if( $this->get_cfg('showManufacturerLink')) { ?>
            <tr align="center">
              <td rowspan="1" colspan="3"><?php echo $manufacturer_link ?><br /></td>
            </tr>
            <tr align="center">
              <td colspan="3">&nbsp;</td>
          </tr>
        <?php ?>
        <tr align="right">
          <td colspan="3" align="center" valign="top">
          <?php echo $product_price_lbl ?> 
          <?php echo $product_price ?><br /></td>
          </tr>
        <tr align="right">
          <td colspan="3" align="center" valign="top"><?php echo $product_packaging ?><br /></td>
          </tr>
        <tr align="center">
          <td colspan="3"><?php echo $ask_seller ?></td>
        </tr>
        <tr id="browseProductDescription">
          <td colspan="3" rowspan="1" align="center"><hr />
              <?php echo $product_description ?><br/>
              <span style="font-style: italic;"><?php echo $file_list ?></span>
          </td>
        </tr>
        <tr align="left">
          <td width="16%" align="left"><?php 
                  
    if( $this->get_cfg'showAvailability' )) {
                      echo 
    $product_availability
                  }
                  
    ?><br />
            </td>
          <td width="17%" align="right"><?php echo $addtocart ?></td>
          </tr>
          <tr align="center">
            <td colspan="4"><?php echo $product_type ?></td>
          </tr>
        <tr align="center">
          <td colspan="4"><hr /><?php echo $product_reviews ?></td>
        </tr>
        <tr align="center">
          <td colspan="4"><?php echo $product_reviewform ?><br /></td>
        </tr>
        <tr align="center">
          <td colspan="4"><?php echo $related_products ?><br />
           </td>
        </tr>
        <?php if( $this->get_cfg('showVendorLink')) { ?>
            <tr align="center">
              <td colspan="4"><div style="text-align: center;"><?php echo $vendor_link ?><br /></div><br /></td>
            </tr>
        <?php  ?>
      </tbody>
    </table></center>
    <?php 
    if( !empty( $recent_products )) { ?>
        <div class="vmRecent">
        <?php echo $recent_products?>
        </div>
    <?php 
    }
    if( !empty( 
    $navigation_childlist )) { ?>
        <?php echo $VM_LANG->_('PHPSHOP_MORE_CATEGORIES'?><br />
        <?php echo $navigation_childlist ?><br style="clear:both"/>
    <?php 
    ?>
    Code:
    /**
    * Main CSS file for the "black color" theme for VirtueMart
    * @copyright 2006-2008 soeren
    * @colortheme (C) 2008 gtwillemsen - surpass.nl
    * @license GNU/GPL
    *
    */
    
    /* General Shop Styles here please */
    .addtocart_button, .notify_button {
    	text-align:center;
    	background-position:bottom left;
    	width:160px;height:30px;
    	cursor:pointer;
    	border: none;
    	font-weight:bold;
    	font-family:inherit;
    	color: #ffffff;
    	vertical-align: middle;
    	overflow:hidden;
    }
    .addtocart_button {
    	background: url( 'images/add-to-cart.png' ) no-repeat  center transparent;
    }
    .notify_button {
    	background: url( 'images/notify.png' ) no-repeat  center transparent;
    }
    .addtocart_button_module {
    	text-align:center;
    	background-position:bottom left;
    	width:160px;height:30px;
    	cursor:pointer;
    	color: #ffffff;
    	border: none;
    	font-weight:bold;
    	font-family:inherit;
    	background: url( 'images/transparent.png' ) no-repeat  center transparent;
    	vertical-align: middle;
    	overflow:hidden;
    	
    }
    
    input.addtocart_button_module:hover  {
    	color: #333333;	
    }
    
    .addtocart_form {
    	width: 100%;
    	display: inline;
    	white-space: nowrap;
    }
    
    /* The quantity box beneath the "add to cart" button  */
    .quantity_box {	
    	vertical-align: middle;
    }
    .quantity_box_button {
    	width:10px;
    	vertical-align:middle;
    	height:10px;
    	background-repeat: no-repeat;
    	background-position: center;
    }
    .quantity_box_button_down {
    	background-image: url(images/down_small.png);
    }
    .quantity_box_button_up {
    	background-image: url(images/up_small.png);
    }
    .continue_link, .checkout_link {
    	margin: 2px;
    	padding: 2px 0px 2px 40px;
    	vertical-align: middle;
    	font-weight: bold;
    	font-size: 1.4em;
    	width: 40%;
    }
    .checkout_link {
    	margin-left: 40px;
    	background: url( 'images/forward.png' ) no-repeat left;
    }
    .continue_link {
    	background: url( 'images/back.png' ) no-repeat left;
    }
    .next_page {
    	background: url( 'images/next_16x16.png' ) no-repeat right;
    	padding-right: 30px;
    	line-height: 20px;
    	float: right;
    	width: auto;
    }
    .previous_page {
    	background: url( 'images/previous_16x16.png' ) no-repeat left;
    	padding-left: 30px;
    	line-height: 20px;
    	float: left;
    	width: auto;
    }
    
    /* This is the text box informing customers about your returns policy */
    .legalinfo {
    	background: #cccccc;
    	border: 2px solid gray;
    	margin: 10px;
    	padding: 0px 0px 10px 10px;
    }
    
    div.pathway {
    	margin-bottom: 1em;
    }
    
    div.pathway img {
    	padding: 0 2px;
    }
    
    /* The PDF, Email and Print buttons */
    div.buttons_heading {
    	margin:10px;
    	width:10%;
    	float:right;
    }
    
    .productPrice {
    	font-weight:bold;
    	white-space: nowrap;
    }
    .product-Old-Price {
    	color:red;
    	text-decoration:line-through;
    }
    /** BROWSE PRODUCTS STYLES **/
    .browseProductContainer {
    	width:100%;
    	padding: 3px 3px 3px 3px;
    	vertical-align: top;
    }
    .browseProductTitle {
    	font-size: 16px; 
    	font-weight: bold;
    	padding: 3px;
    	margin-top: 3px;
    	width: 30%;
    	float: left;
    }
    .browseProductImageContainer {
    	float: left;
    	width: auto;
    	margin: 3px;
    }
    .browseProductImageContainer {
    	margin: 3px;
    	float: left;
    	height:130px;
    	width:120px;
    }
    .browseProductDetailsContainer {
    	float: left;
    	width: 70%;
    }
    .browseProductDescription {
    	margin-top: 40px;
    	width:40%;
    }
    .browsePriceContainer {
    	float: left;
    	margin: 5px;
    	width:20%;
    }
    .browseAddToCartContainer {
    	width:30%;
    	text-align:center
    }
    .browseRatingContainer {
    	float: left;
    	width:25%;
    	margin: 3px;
    	white-space: nowrap;
    }
    
    /** Flypage Styles **/
    .thumbnailListContainer {
    	text-align: center;
    	width: 200px;
    	height: 200px;
    	overflow: auto;
    }
    
    /*
    General Form Styling
    */
    .formLabel {
    	float:left;
    	width:30%;
    	text-align:right;
    	font-weight: bold;
    	margin: 2px;
    	white-space: nowrap;
    	clear: left;
    	vertical-align: middle;
    	margin-top: 8px;
    }
    
    #agreed_div {
    	white-space: normal;
    }
    
    .formField {
    	float:left;
    	width:60%;
    	margin: 2px;
    	vertical-align: middle;
    	margin-top: 8px;
    	
    }
    .missing {
    	color:red;
    	font-weight:bold;
    }
    
    /**
    * Administration Styles
    */
    .adminListHeader {
    	float:left; height: 48px; background-repeat: no-repeat;
    	text-align: left; font-size: 18px; font-weight: bold;
    	padding-left: 80px;	
    }
    
    .labelcell {
    	margin-left: auto;
    	font-weight: bold;
    	vertical-align: top;
    	width: 30%;
    }
    table.adminform td.labelcell {
    	text-align: right;
    }
    .iconcell {
    	vertical-align: top;
    	width: 5%;
    }
    .shop_error, .shop_warning, .shop_info, .shop_debug, .shop_critical, .shop_tip {
    	background-color:#FAFAD2;
    	background-position:left 5px;
    	background-repeat:no-repeat;
    	border-color:#AACCAA;
    	border-style:dotted none;
    	border-width:1px 0pt;
    	font-weight: 900;
    	margin:1pt 1pt 1em 1em;
    	padding:0.5em 1em 1.5em 48px;
    }
    .shop_error {
    	background-image: url( images/error.png );
    }
    .shop_warning {
    	background-image: url( images/warning.png );
    }
    .shop_info, .shop_tip {
      	background-image: url( images/info.png );
    }
    
    .shop_debug {
    	background-image: url( images/log_debug.png );
    
    }
    .shop_critical {
    	font-weight: bold;
    	background-image: url( images/log_critical.png );
    }
    /**
    * Addtocart detail Styles
    */
    .vmCartContainer { /* Cart Container */
    	width: auto;
    	float: right;
    	background: #cccccc;
    	border: 1px solid #000;
    	padding: 3px;
    }
    
    .vmCartChildHeading { /* Header for the cart */
    	font-size: 14px;
    	font-weight: bold;
    	padding-bottom: 3px;
    	text-align: left;
    }
    
    .vmCartChild { /* Container for the Child Product */
    	
    	vertical-align: middle;
    	border: 1px solid #000;
    	padding-left: 2px;
    	padding-right: 2px;
    	margin-bottom: 2px;
    	float:left;	
    }
    
    .vmChildDetail { /* Child Detail, description , attributes ,price, quantity etc */
    	vertical-align: middle;
    	margin-top: 6px;
    }
    
    .vmCartChildElement { /* Individual element styling */
    	width: 100%;
    	vertical-align: middle ;
    	height: 25px;
    	text-align: left;
    	
    }
    
    .vmCartAttributes { /* Attributes Div*/
    	
    	margin-top:8px;
    	width:100%;
    }
    
    .vmAttribChildDetail {  /* Product Attributes Styling */
    	
    }
    	
    
    .vmMultiple {
    	height:35px;
    }
    
    
    
    .vmChildType { /* Product type div*/
    
    width: 100%;
    }
    
    .vmClearDetail { /*Clear the divs afer child types*/
    	clear: both;
    }
    
    .vmClearAttribs { /*Clear the divs before the attributes*/
    	clear:both;
    }
    .vmRowOne { /* Odd Row One styling */
    	background: #cccccc;	
    }
    
    .vmRowTwo { /* Even Row Styling */
    	background: white;
    }
    
    /* Link Details for link to child*/
    .vmChildDetail a, .vmChildDetail a:link {
      font-size        : 11px;
      color            : #000000;
      text-decoration  : none;
      font-weight      : bold;
    }
    .vmChildDetail a:hover {
      font-size        : 11px;
      color            : #333333;
      text-decoration  : none;
      font-weight      : bold;
    }
    /* Styling for the form elements to enable correct Line Up  */
    .inputboxquantity {
    	margin-top: 3px;
    	vertical-align: middle;
    }
    .availabilityHeader {
    	text-decoration:underline;
    	font-weight:bold;
    }
    .inputboxattrib {
    	float: left;
    	margin-top: 0px;
    	vertical-align: middle;
    	margin-bottom: 2px;
    }
    
    .quantitycheckbox {
    	margin-top: 6px;
    	vertical-align: middle;
    }	
    
    /**
    * Addtocart detail Styles for placing attributes beside product_types
    */
    .vmCartContainer_2up { /* Cart Container */
    	width: 100%;
    	float: left;
    	background: #cccccc;
    	border: 1px solid #000;
    	padding: 3px;
    }
    
    .vmCartChildHeading_2up { /* Header for the cart */
    	font-size: 14px;
    	font-weight: bold;
    	padding-bottom: 3px;
    	text-align: left;
    }
    
    .vmCartChild_2up { /* Container for the Child Product */
    	
    	vertical-align: middle;
    	border: 1px solid #000;
    	padding-left: 2px;
    	padding-right: 2px;
    	
    	margin-bottom: 2px;
    	float:left;	
    }
    
    .vmChildDetail_2up { /* Child Detail, description , attributes ,price, quantity etc */
    	vertical-align: middle;
    	margin-top: 6px;
    }
    
    .vmCartChildElement_2up { /* Individual element styling */
    	width: 100%;
    	vertical-align: middle ;
    	height: 25px;
    	text-align: left;
    	
    }
    
    .vmCartAttributes_2up { /* Attributes Div*/
    	float: left;
    	padding: 0px 5px 5px 5px;
    	margin: 0px 5px 5px 5px;
    	width:50%;
    }
    
    .vmAttribChildDetail_2up {  /* Product Attributes Styling */
    	
    }
    	
    .vmMultiple {
    	height:35px;
    }
    
    .vmChildType_2up { /* Product type div*/
    	background: #cccccc;
    	padding: 0px 5px 5px 5px;
    	margin: 0px 5px 5px 5px;
    	float: left;
    	width: 40%;
    	border: 1px solid #000;
    }
    
    .vmClearDetail_2up { /*Clear the divs afer child types*/
    	
    }
    
    .vmClearAttribs_2up { /*Clear the divs before the attributes*/
    	clear:both;
    }
    .vmRowOne_2up { /* Odd Row One styling */
    	background: #cccccc;
    }
    
    .vmRowTwo_2up { /* Even Row Styling */
    	background: white;
    }
    
    /* Link Details for link to child*/
    .vmChildDetail_2up a, .vmChildDetail_2up a:link {
      font-size        : 11px;
      color            : #000000;
      text-decoration  : none;
      font-weight      : bold;
    }
    .vmChildDetail_2up a:hover {
      font-size        : 11px;
      color            : #333333;
      text-decoration  : none;
      font-weight      : bold;
    }
    
    .vmCartModuleList  {
      cursor : pointer;
      font-size        : 11px;
      color            : #000000;
      text-decoration  : none;
      font-weight      : bold;
    }
    .vmCartModuleList:hover {
      font-size        : 11px;
      color            : #333333;
      text-decoration  : none;
      font-weight      : bold;
    }
    .vmquote {
    	margin: 4px;
    	border: 1px solid #cccccc;
    	background-color: #E9ECEF;
    	padding: 10px;
    	font-size: 12px;
    	color: #254D78;
    }
    .editable {
    	background: #ffff33;
    	cursor: pointer;
    }
    ul.pagination li {
    	padding: 2px 1px;
    	display: inline;
    	background: none;
    }
    .hr {
      clear:both;
      border:1px solid #FFFFFF;
      height:1px;
      width:100%;
      text-align:left;
    }
    .hr_div {
            height:10px;
            width:100%;
    }
    .clr {
      clear: both;
      overflow:hidden;
    }
    .box img, #child ul li a img {
    height:48px;
    margin:0 2px 0 0;
    width:64px;
    }
    #parent_img {width: 325px; height: 221px; margin-left: auto; margin-right: auto;}
    #parent_img a {text-decoration: none;}
    #parent_img a img {width: 325px; height: 221px}

  • #2
    Senior Coder Rowsdower!'s Avatar
    Join Date
    Oct 2008
    Location
    Some say it's everything.
    Posts
    2,027
    Thanks
    5
    Thanked 397 Times in 390 Posts
    I'm not seeing the issue you describe when I go to the page you specified. Have you already sorted this out?
    The object of opening the mind, as of opening the mouth, is to shut it again on something solid. G.K. Chesterton
    See Mediocrity in its Infancy
    It's usually a good idea to start out with this at the VERY TOP of your CSS: * {border:0;margin:0;padding:0;}
    Seek and you shall find... basically:
    validate your markup | view your page cross-browser/cross-platform | free web tutorials | free hosting

  • #3
    New to the CF scene
    Join Date
    Mar 2010
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Yes, I just sorted it out yesterday. Thank you for looking!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •