View Full Version : Making an image open in a seperate window?
Espezito
November 30th, 2005, 03:50 PM
Hey all! I'm currently working on my website, dmboyledesign.com, and I was wondering about something....
Currently, when a thumbnail for an image is clicked, it will open in the same window, and be justified to the top left of the screen. What I'd like to make it do is open in a new window sized to the image. I'm using Macromedia Dreamweaver MX to make the site, and I'm hosted by godaddy.com. If someone could give me some tips I'd greatly appreciate it!
Also, please visit my site and let me know how you feel about the layout. There are many sections not up yet but I'm slowly getting there.
Thanks a bunch in advance!!
MoP
November 30th, 2005, 04:46 PM
I usually do it in this manner, for images linked from a thumbnail:
<a href="#" onclick="window.open('your_image.jpg','ImageName','width=80 0,height=600,resizable=no,scrollbars=no,toolbar=no ,directories=no,status=no,menubar=no,copyhistory=n o')"><img src="thumbnail_image.jpg"></a>
One note about that, it scrolls the page you clicked the link on to the top whenever the link is clicked (due to the href="#" part), but if all your thumbnails are grouped together in a whole page filling the window, that shouldn't be a problem.
Also note that in the "width" and "height" values, you should add a few pixels in each direction, otherwise the image sometimes can be scrolled using the middle mouse button, and that looks weird.
Hope that helps. :^^:
_Mario
November 30th, 2005, 05:24 PM
When you create a link in Dreamweaver then you should be able to change things int he properties.
The menu is at the bottom somewhere (if you haven't changed it). there should be the cross-hair somewhere that you can use to drag to a site in your "site-structure-menu" to create "drag and drop" links. And there should be a menu where you can chose some properties.
Change it thre to: target="_blank" (or do it directly in the html file)
here is a picture:
http://rescomp.stanford.edu/staff/manual/rcc/teaching/cs2c/materials/7b-screenshots/dreamweaver-image.png
See the target menu item at the bottom? if you have selected something that is a link then you should be able to select stuff there. _blank will give you the new window.
Tip: leave it as it is, no new window. People who want a new window can right click it (or just open it in a new tab). So if someone wants to see your gallery then they can open the individual pictures how they want and I for example hate to have 20 windows open so I am glad when someone doesn't force open a new window with javascript (then I can't open it with right click).
Edit: Of course you have to have the properties window open or you won't see it.
MoP
November 30th, 2005, 05:31 PM
Mario makes a good point here - you might want to avoid using popups at all. My current website uses popups, but I'm overhauling it so that large images will open in the main page, while still keeping the thumbnail navigation available.
This means people won't have to open/close new windows all the time, and everything stays nicely organised - I'd recommend just trying to find a design where the large image opens in the main page while still preserving the navigation.
Espezito
November 30th, 2005, 06:46 PM
I'd recommend just trying to find a design where the large image opens in the main page while still preserving the navigation.
Yeah that's a good idea as well. It's just that I really lack the knowledge in web design to do something like that haha. Most of my knowledge thus far is from viewing the source code on websites I like... But something like having the main image view on the left of the page with the thumbs on the right makes my head wanna 'splode...
Any suggestions on websites or something that could guild me? Or templates I could use and then put my images in? You guys have given me awesome advise so far, THANK YOU. But now you've got me wanted to do even more :D
vBulletin® v3.8.2, Copyright ©2000-2012, Jelsoft Enterprises Ltd.