Member Avatar for GR Web FX

Hey People,

im putting together an image gallery for someone where by there is a thumbnail image on a page, and when you the image a new pop up window opens with a larger image.

The function i am using to generate this is by clicking on the thumbnail image, then going to the behaviours tab in dreamweaver, adding a new window browser, change the event to onClick. My pop up window is 400 x 300. The problem is when i click on the image and the pop up appears, it always goes to the top left hand side of my screen. Is there anyway using this method that i can center the pop up in the center of my screen?

Thanks alot
GR Web FX

  • 3 Contributors
  • 3 Replies
  • 135 Views
  • 2 Days Discussion Span
  • Latest Post Latest Post by GR Web FX
peter_budo commented: This is a challenge. Will be glad to know solution for this. Let wait and see!!!!!!! +1

Dani AI

Generated

asked why Dreamweaver's popup always appears at the top-left. pointed toward JavaScript and linked to a popup generator. Dreamweaver's built‑in "Browser Window" behavior sets width/height but usually doesn't set screen coordinates, so the generated window.open ends up at the default position. A small cross‑browser function that computes left/top and calls window.open fixes this and works better on multi‑monitor setups.

Here is a compact, robust centering function (place it in the page head or an external .js file):

function openCentered(url, title, w, h) {
  var dualScreenLeft = (window.screenLeft !== undefined) ? window.screenLeft : window.screenX;
  var dualScreenTop  = (window.screenTop  !== undefined) ? window.screenTop  : window.screenY;

  var viewportWidth  = window.innerWidth || document.documentElement.clientWidth || screen.width;
  var viewportHeight = window.innerHeight || document.documentElement.clientHeight || screen.height;

  var left = ((viewportWidth / 2) - (w / 2)) + dualScreenLeft;
  var top  = ((viewportHeight / 2) - (h / 2)) + dualScreenTop;

  var features = 'scrollbars=yes,resizable=yes,width=' + w + ',height=' + h + ',top=' + top + ',left=' + left;
  var newWin = window.open(url, title, features);
  if (newWin && newWin.focus) newWin.focus();
  return newWin;
}

Integration notes and troubleshooting: replace Dreamweaver's generated onClick with a call to openCentered('big.jpg','imgPop',400,300); or use Dreamweaver's "Call JavaScript" behavior to invoke it. Pop‑up blockers may still block new windows (modern browsers treat programmatic windows differently), and mobile browsers often ignore window positioning—so centering may not be applied there. For a more reliable, mobile‑friendly UX, consider an overlay/modal or a lightbox library (Lightbox2, Fancybox, etc.). 's generator is useful for learning; the snippet above adds dual‑screen and viewport fallbacks for real‑world robustness.

Recommended Answers

All 3 Replies

Member Avatar for Dogtree

One word: Javascript. A quick google search will give you something like this.

Member Avatar for magusdf

not sure how much you'd like to get into the scripting on it as youre using the dreamweaver functions.

but here is a site that should help you customize that code
in turn get you a better understanding of how it works

http://javascript.internet.com/generators/popup-window.html

good luk,
MagusDF

Member Avatar for GR Web FX

Excellent, thankyou for your help :)

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.