|
Posted by joshkotecha@gmail.com on 10/09/05 06:11
I'm trying to solve a problem with iframe and image.
I've set up 3 column layout where the left and right column
are fixed size. I need a gif/jpg to pop up in the middle column
and the picture needs to dictate the size of the middle column.
I tried to setup an iframe for the middle. This sort of works.
I change the src of the iframe using javascript.
The problem is that the picture doesn't fit the middle column. I get
scroll bars -- this is what I don't want. If I made the center a <img
src="mypic1.jpg" id="pic" name="pic"></img> the picture shows up. But I
can't get the src name in javascript. I keep getting NaN or undefined.
I'm doing
mypix = document.getElementByID("pic").src. This works with iframe,
but doesn't work with image.
I need to know the name of the source so when I find mypic1.jpg then I
can change to mypic2.jpg when user clicks "NEXT" and mypic0.jpg when
user click "PREV".
Here's the script I've been toying with ....
<html>
<head>
<title>Iframe Test</title>
<style>
#menu {float: left; border: 5px solid; border-color: red; width: 15%;
height: 100%;}
#hitmebody {float: left; border: 5px solid; border-color: blue; height:
100%}
#adspace {float: left; border: 5px solid; border-color: red; width:15%;
height:100%;}
* {margin: 0; padding: 0;}
</style>
</head>
<body>
<div id="menu">
<a href="my2.htm" target="hitme">NEXT</a>
</div>
<div id="hitmebody">
<iframe name="hitme" src="my1.htm" marginwidth="0" marginheight="0"
frameborder="0" scrolling="0" width="700" height="750"></iframe>
</div>
<div id="adspace">
<h1>Hello World </h1><br/>
<h1>Bye World!</h1><br/>
</div>
</body>
</html>
Navigation:
[Reply to this message]
|