Jump to content

Archived

This topic is now archived and is closed to further replies.

kevinpilot

PopThumbs

Recommended Posts

kevinpilot

I am using popThumb on my forkliftdealers.com home page.  When the user clicks on the + sign to see a larger photo and the window opens the prettyphoto window to show the large image, I would like to place a button underneath the large image. See my attachment.  I have searched the editor, but can not find where to edit the code for this page. Any help would be appreciated.

-K

 

PS - I am running DMS 1.1.3 Pro Account

popthumb.png

Share this post


Link to post
Share on other sites
James B

Hi there, the popup code is from the prettyphoto.js file inside the popthumb section. I'm not exactly sure how you would add this as it's javascript but I'd imagine looking at the code you'd have to add to the 'custom markup' section in the js file the class/code for the button.


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites

  • Similar Content

    • 1pp1k10k4m1
      By 1pp1k10k4m1
      I have a horizontal menu system, using the UberMenu 3 adapter and UberMenu 3 along with DMS v2.1.9.1 and a WooCommerce plugin called Cloud Zoom (for magnifying product photos) (http://www.mrova.com/woocommerce-cloud-zoom/, which seems to use the jQuery lib PrettyPhoto, I'm not a programmer, so I'm not positive).
       
      The trouble is, when I hover over the menu, the photo is displayed on top of the menu, and whatever is on the menu is hidden by the photo. It happens in all major browsers, so I don't think it is a browser issue. 
       
       Here's the code from that div when grabbing it out of Firebug:   <div class="images"> <div style="top:0px;z-index:9999;position:relative;" id="wrap"><a data-rel="prettyPhoto[product-gallery]" title="Euro Wood" class="zoom first cloud-zoom" href="http://fastcarts.davidstellsphoto.com/wp-content/uploads/2014/12/SWF2001.jpeg" rel="zoomWidth:'auto',zoomHeight: 'auto',position:'right',adjustX:0,adjustY:0,tint:'false',tintOpacity:0.5,lensOpacity:0.5,softFocus:false,smoothMove:3,showTitle:false,titleOpacity:0.5" style="position: relative; display: block;"><img width="300" height="300" alt="Euro Wood" class="attachment-shop_single" src="http://fastcarts.davidstellsphoto.com/wp-content/uploads/2014/12/SWF2001-300x300.jpeg" style="display: block;"></a><div style=";z-index:999;position:absolute;width:341px;height:341px;left:0px;top:0px;" class="mousetrap"></div></div> <div class="thumbnails"><a data-rel="prettyPhoto[product-gallery]" title="Euro Wood" class="zoom first" href="http://fastcarts.davidstellsphoto.com/wp-content/uploads/2014/12/SWF2001.jpeg"><img width="300" height="300" alt="Euro Wood" class="attachment-shop_single" src="http://fastcarts.davidstellsphoto.com/wp-content/uploads/2014/12/SWF2001-300x300.jpeg"></a></div> </div> I've also attached a few screenshots and the URL I'm using as an example is: http://fastcarts.davidstellsphoto.com/product/14-euro-wood-steering-wheel/
       
      Thanks!
         
×