IFrame Options

[chriscc17]

I am trying to use an IFrame with a Chatbot. (you type a message to the bot and he responds back). Here is the address

http://www.frontiernet.net/~wcowart/iframe.html

When the page first loads the iframe would have a "website can not be displayed message" which is fine. I'm using a blank white webpage (cover-page.html) to cover that up. Next to it is a visible X button to close the Iframe once it is used.

So you would type to the bot the word "test" and the iframe appears with the link to Wikipedia.

CODE

if (input.search("test")!= -1)
{document.result.result.value = "Searching Wikipedia";
document.getElementById('iframe_a').src = 'http://www.wikipedia.org/';
return true;}

You would close that link by clicking on the X button.


What I would like to do is when the page loads the X button would be invisible or blend into the background somehow. I tried using a whiteback ground for the button but the edge of the button is still visible.

I would like to have the button appear when the Iframe link is displayed. So it can be seen to close the iframe. However, I would like for the button to disappear as the iframe is closed.

In short I just find the button on load annoying just sitting there. Also it remaining there once the iframe link is closed.


Maybe I'm going about this all wrong but that what I'm attempting to have happen.

Any idea would be appreciated.

CODE

<iframe src="C:\Users\Wendell Cowart\Elf Bot\cover-page.html" align="center" name="iframe_a" width="600" height="180" frameborder="0">
</iframe>
  <input type="button" value="X" name="button" onclick="document.getElementById('iframe_a').src='cover-page.html';"/>