Possible to do the following

JavaScript
1

at my page at www.meadowlarkco.com/customersnew2.php Im going to make the word ‘Technology’ a link to open up a popup, but how can I set the size of the popup?

The other thing I was thinking of doing was when the user clicks on Technology have my technology content open up in the same spot as where the control image is, could someone give me an idea on how to start about doing this? Im assuming I couldn’t have the control image a background image as it is now.

thanks

2

You can specify both the size and the placement of the popup in the window.open method, but it looks like you’re already doing both (reformatted for readability):


window.open(
    'http://www.meadowlarkco.com/customersnew2.php',
    'popup',
    'width=500,height=500,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'
);

Just change the width and the height to whatever size you’d like.

But when it comes to setting the window’s position to where the element is located on the screen… That’s going to require a change. You currently use inline JavaScript to open the popup:


<a href="..." onclick="window.open(...); return false">Technology</a>

You’ll have to move that somewhere else, and use an event handler or an event listener. And that involves actually grabbing the “Technology” link so that you can give it an event handler/listener, which presents issues of its own.

But the point of all this is that you can then access the event object, which has the clientX and clientY properties, which you can use to set the popup’s position.

Essentially, you’ll want to change your HTML to something like this:


<a href="http://www.meadowlarkco.com/customersnew2.php" id="techPopup">Technology</a>

<!-- other stuff -->

<script type="text/javascript">
var techLink = document.getElementById('techPopup');
techLink.onclick = function (e) {
    e = e || window.event;
    window.open(techLink.href, 'popup', 'width=500,height=500,etc,etc,left=' + e.clientX + ',top=' + e.clientY);
    return false;
};
</script>

I’m not sure how much control this will give you over the popup’s precise position, but it’s a good start.

3

use this code <a href=“…” onclick=“window.open(…); return false”>Technology</a>