Log in

View Full Version : Publisher 2003 - pop up window



Chris Brogan
08-08-2005, 09:18 AM
I'm new to this so please excuse me if I have posted to wrong forum.

I am new to web development. I do not know html well. I am using Publisher 2003 to create a fairly basic website and am getting on quite well with it. It's mainly just to post personal photographs etc.

What I have at the moment is a small photo which I click on and it leads you into a web page with a photo on and you then click Next/Previous to scroll through the photos.

What I want to achieve is a small web window with the photo framed in it and scroll through each photo using Next/Previous - rather than looking at the full screen. Is there a way of achieving this in Publisher?

And if so, can anyone explain to me how I do this in laymans terms!!

Many thanks

Twey
08-08-2005, 10:25 AM
I don't know about Publisher, but you can do this using
<script type="text/javascript">
window.open("pagename.htm");
</script>
in HTML.

Chris Brogan
08-08-2005, 11:46 AM
That's great - gives me the pop-up window.

Next question: How do I get rid of the tool bar around it so the photo is framed in it.

And how do I hide the code?

What I want to do is click on a tiny photo which takes me into a popup window with a photo framed. I can then click on next/previous to go to next photo in the pop-up, etc.

Hope that makes sense.

I am totally new to all this so it's difficult for me to verbalise in the correct terms what I am trying to achieve.

Many thanks


Chris

Twey
08-08-2005, 01:57 PM
gallery.htm:


...
<script type="text/javascript">
function show(image) {
var showwin = window.open("show.htm");
showwin.document.getElementById("fullsize").src = image.src;
}
</script>
...
<img src="image1.jpg" onclick="show(this);"/>
...


show.htm:

<html>
<head>
<title>Image View</title>
<script type="text/javascript">
function imageNext() {
document.getElementById("fullsize").src = "image" +
parseInt(document.getElementById("fullsize").src) + ".jpg";
}
</script>
</head>
<body>
<img src="imageloading.jpg" id="fullsize"/>
<br/>
<div>
<a href="javascript:imageBack();">Back</a>
<a href="javascript:imageNext();">Next</a>
</div>
</body>
</html>

... will probably work.