Controlling size of popups from html image map |
Controlling size of popups from html image map |
ACS6 |
Mar 7 2008, 04:07 AM
Post
#1
|
Group: Members Posts: 5 Joined: 7-March 08 Member No.: 5,135 |
Hi Guys,
I need major help here. Just managed to figure out how to create image maps using html, I know it's a no-brainer for most, but now I need to control the size of the new window that pops up when a certain spot on the map is clicked. At the moment, I get a full window with all the toolbar options and huge white background space, when all I need is a small 400X400 pixel frame to display a jpeg. How can I achieve that? I'm using MS Frontpage...it's the only program I am comfortable using coz I really know nuts about programming. Thanks in advance! ACS6 |
Frederiek |
Mar 7 2008, 04:43 AM
Post
#2
|
Programming Fanatic Group: Members Posts: 5,146 Joined: 23-August 06 From: Europe Member No.: 9 |
See the FAQ entry How do I create a link that opens a new window of a specific size?.
You also might want to take a look at CSSplay's Image map for detailed information, which is a fancy way in CSS, without opening new windows. |
ACS6 |
Mar 17 2008, 10:09 PM
Post
#3
|
Group: Members Posts: 5 Joined: 7-March 08 Member No.: 5,135 |
Thanks for the feedback. Below is the html script for my image map.
<head> <meta http-equiv="Content-Language" content="en-us"> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <meta name="GENERATOR" content="Microsoft FrontPage 4.0"> <meta name="ProgId" content="FrontPage.Editor.Document"> <title>My Image Map</title> <base target="_blank"> </head> <body bgcolor="#402000" leftmargin="0"> <p align="left"><map name="FPMap0"> <area href="chips/8/PG8_1.jpg" target="_blank" shape="rect" coords="64, 239, 107, 281"> <area href="chips/8/PG8_2.jpg" target="_blank" shape="rect" coords="128, 237, 170, 279"> <area href="chips/8/PG8_3.jpg" target="_blank" shape="rect" coords="193, 240, 237, 281"> <area href="chips/8/PG8_4.jpg" target="_blank" shape="rect" coords="258, 238, 300, 279"> </body> </html> The target points to a "_blank". So how can I adjust the sizing of the new window, eliminate address bar, scroll bar etc.? I've checked out the links and they make absolute sense using Java script (which I'm also a dumbo in, only know how to cut and paste codes). But how do I, in my case of using basic rectangular image mapping shapes on a JPEG base image (via Frontpage 4.0), define the size and the resulting new window? Thanks in advance! |
Darin McGrew |
Mar 17 2008, 10:23 PM
Post
#4
|
WDG Member Group: Root Admin Posts: 8,365 Joined: 4-August 06 From: Mountain View, CA Member No.: 3 |
Please see the FAQ entry How do I create a link that opens a new window of a specific size?
In your case, you'll put the onclick attribute in the area element, rather than in the a (link) element. |
ACS6 |
Mar 17 2008, 11:23 PM
Post
#5
|
Group: Members Posts: 5 Joined: 7-March 08 Member No.: 5,135 |
Thanks Darin, but I'm really struggling with this. Could you do an example with the html code I pasted above? Thanks!
|
Darin McGrew |
Mar 18 2008, 01:00 AM
Post
#6
|
WDG Member Group: Root Admin Posts: 8,365 Joined: 4-August 06 From: Mountain View, CA Member No.: 3 |
This is untested. I just copy-pasted from the FAQ entry and from your posted markup.
CODE <area href="chips/8/PG8_1.jpg" target="_blank" shape="rect" coords="64, 239, 107, 281" onclick="window.open('chips/8/PG8_1.jpg', '_blank', 'width=300,height=150'); return false"> |
ACS6 |
Mar 18 2008, 02:29 AM
Post
#7
|
Group: Members Posts: 5 Joined: 7-March 08 Member No.: 5,135 |
Darin! you're a bloody lifesaver!!!! Thanks mate. It worked wonders!!!! One more question, if I want to add a page title to it, where do I put in the code for title?
|
ACS6 |
Mar 19 2008, 08:52 PM
Post
#8
|
Group: Members Posts: 5 Joined: 7-March 08 Member No.: 5,135 |
Hi Darin,
Please help. How do I add text to the page title for the pop up windows using your script above? Thanks! |
Darin McGrew |
Mar 20 2008, 12:20 AM
Post
#9
|
WDG Member Group: Root Admin Posts: 8,365 Joined: 4-August 06 From: Mountain View, CA Member No.: 3 |
You can link to an HTML document, rather than to the image. The HTML document displays the image inline, but can also include a title element, headings, captions, links, etc.
|
Lo-Fi Version | Time is now: 18th April 2024 - 04:34 AM |