Rollover image popup

Message Topic Search Topic Options Post Reply Create New Topic Printable Version Translate Topic

http://www.1st-line.com/machines/comm_mod/esprmach/vibiemme/juniorhx.html***this page has been redirected to our new site
I have a couple pages like this that I want to build into PC where you rollover a link and a picture pops up.  With the new site I have less space to work with so I was thinking to have it popup in a window and disappear when you rollout.  I found this page and wanted to put in something like this.

http://www.dynamicdrive.com/style/csslibrary/item/css-popup-image-viewer/
I copied the css part into pcHeaderFooter11.css at the bottom.
I copied the html part into a test page I made.

Will something like this not work in PC?

Edited by GreggS - 01-May-2013 at 3:28pm

Author	Message Topic Search Topic Options Post Reply Create New Topic Printable Version Translate Topic
GreggS Members Profile Send Private Message Find Members Posts Add to Buddy List Groupie Joined: 06-February-2012 Location: New Jersey Status: Offline Points: 60	Post Options Post Reply Quote GreggS Report Post Thanks(0) Quote Reply Topic: Rollover image popup Posted: 14-November-2012 at 6:40pm
	http://www.1st-line.com/machines/comm_mod/esprmach/vibiemme/juniorhx.html***this page has been redirected to our new site I have a couple pages like this that I want to build into PC where you rollover a link and a picture pops up. With the new site I have less space to work with so I was thinking to have it popup in a window and disappear when you rollout. I found this page and wanted to put in something like this. http://www.dynamicdrive.com/style/csslibrary/item/css-popup-image-viewer/ I copied the css part into pcHeaderFooter11.css at the bottom. I copied the html part into a test page I made. Will something like this not work in PC? Edited by GreggS - 01-May-2013 at 3:28pm

Guests Members Profile Send Private Message Find Members Posts Add to Buddy List Guest	Post Options Post Reply Quote Guests Thanks(0) Quote Reply Posted: 14-November-2012 at 6:57pm
	Hi Gregg, This is pure CSS and has nothing to do with PC per se. All it does is shove the images way off to the left by default, and then moves them back into the view port on hover. All you need to do is get more specific (keeping in mind the "Cascading" nature of CSS) with how you're calling the CSS for this.

GreggS Members Profile Send Private Message Find Members Posts Add to Buddy List Groupie Joined: 06-February-2012 Location: New Jersey Status: Offline Points: 60	Post Options Post Reply Quote GreggS Report Post Thanks(0) Quote Reply Posted: 01-May-2013 at 3:11pm
	I go this to work finally. Here is an example. http://www.1st-line.com/store/pc/viewPrd.asp?idproduct=3560 I am running into another issue with the HTML editor. Here is the code for the 1st link. <a class="thumbnail" href="#thumb">Mirror-polished stainless steel body panel.<span><img alt="" src="../pc/catalog/vibiemme/djhxmavain/mirror-body.jpg" height="300" width="300"></span></a> The problem I run into is when I have to edit the page again. If I use the HTML Editor and save, it removes the <span>'s around the image. <a class="thumbnail" href="#thumb">Mirror-polished stainless steel body panel.<img alt="" src="../pc/catalog/vibiemme/djhxmavain/mirror-body.jpg" height="300" width="300"></a> The HTML Editor also does things like replacing the <b>'s with <span style="font-weight: bold;"> I'm guessing it cleans up the code. Is there something I can do so the HTML Editor doesn't do this?