I wanted to post a question asking how to do full-sized image popups when you mouseover a thumbnail but I didn't know what coding language would be best for that... javascript? I want to post it in the right forum.
Announcement
Collapse
No announcement yet.
Pop-up image preview on mouseover... what would I use for that?
Collapse
X
-
-
I decided to go with this one: http://www.kevinandamanda.com/whatsn...pop-up-preview
But I'm not having any luck with it. I don't know what I'm doing wrong. I added the css to my stylesheet, uploaded the .js file, and made a test page here: http://opalcat.com/article/testing-mouseover
But nothing happens when I mouseover the image. I'm sending them an email but I thought I'd post here as well, in case there is something obvious I'm doing wrong.
Is there a way to tell if the .js file is actually loading? Do I need to put a slash at the beginning so it looks in the main directory? Or would I need an absolute path from the server to do that?
Comment
-
-
I added their css to my own css file so I wouldn't have to reference them both... will that not work?
In their example included in the zip file (which works) the html is only this:
Code:<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Untitled Document</title> <link rel="stylesheet" href="style.css" type="text/css"> <script src="mouseover_popup.js" language="JavaScript" type="text/javascript"></script> </head> <body> <div style="display: none; position: absolute; z-index: 110; left: 400; top: 100; width: 15; height: 15" id="preview_div"></div> <img src="smallpic.jpg" border="0" onmouseover="showtrail('largepic.jpg','Title of the Picture Goes Here',310,440)" onmouseout="hidetrail()"></a> </body> </html>
Comment
-
-
I separated it out so that the stylesheet is on its own, but it still isn't working.
Again, the example only calls for one .js file and the example works when I open it.
AHA I figured it out. I had to put the full url to the .js file in the head tag. A relative path nor just the filename worked.
Comment
-
Comment