Welcome to WebmasterWorld Guest from

Forum Moderators: incrediBILL

Message Too Old, No Replies

Firefox pop up problem



9:11 pm on Jul 12, 2007 (gmt 0)

5+ Year Member

Im creating an e-commerce site and am trying to show a pop up of the full image when the user clicks on the thumbnail image. now ive used the basic "_blank" command which works fine in early firefox and IE, but in the new firefox it just loads up in a new tab rather than a new window?

Any one know a way around this?


Chris Middleton


9:14 pm on Jul 12, 2007 (gmt 0)

WebmasterWorld Senior Member 5+ Year Member

that is something set by the user. they can choose to have links open up in the same page, in a new window, or in a new tab -- it's not something you have control over.
if it was me, i would forget the open a new window idea, because you will never be able to get it consistent for this reason.

try opening up a div instead. you can use a combination of CSS and javascript to make a hidden div appear when a link is clicked. you can even give the div borders and scrollbars to make it look like a window, if you like. and you can be sure that all users will see the same thing.


9:43 pm on Jul 12, 2007 (gmt 0)

5+ Year Member

Cheers londrum, will look into some java stuff, but as i know nothing about it should be fun! cheers tho.



10:02 pm on Jul 12, 2007 (gmt 0)

WebmasterWorld Senior Member penders is a WebmasterWorld Top Contributor of All Time 5+ Year Member Top Contributors Of The Month

...will look into some java stuff...

Just in case you go off buying the wrong book... that's JavaScript, not 'Java'. Java is a very different beast, which I don't think is even covered by WebmasterWorld! ;)


10:22 pm on Jul 12, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member


I have a script and CSS to do exactly what penders describe with <div>. This will pop-up the <div> where you place it in the page:

<script type="text/javascript">
function HideContent(d) {
if(d.length < 1) { return; }
document.getElementById(d).style.display = "none";
function ShowContent(d) {
if(d.length < 1) { return; }
document.getElementById(d).style.display = "block";
function ReverseContentDisplay(d) {
if(d.length < 1) { return; }
if(document.getElementById(d).style.display == "none") { document.getElementById(d).style.display = "block"; }
else { document.getElementById(d).style.display = "none"; }
<style type="text/css">
div.largeImage {
border:5px solid #000090;
background-color: #000000;
padding: 10px;
font-family: Arial,sans-serif;
font-size: 12px;
font-weight: bold;
color: #FFFFFF;
text-align: center;

The <div>

<div id="uniqueID" class="largeImage"><img src="small_image.gif"></div>

The Link:

<img src="small_image.gif" onmouseover="ShowContent('uniqueID'); return true;" onmouseout="HideContent('uniqueID'); return true;" />

All that matters is that the ID's in the <div> match the onmouse event ID.


[edited by: Marshall at 10:23 pm (utc) on July 12, 2007]


Featured Threads

Hot Threads This Week

Hot Threads This Month