By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,654 Members | 1,422 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,654 IT Pros & Developers. It's quick & easy.

Add OBJECT in DIV

P: n/a
Hi. I'm trying to add an OBJECT in an existing DIV after a certain
delay.

Here is my currend code :

<div id="dummy" style="position: absolute; visibility: visible; top:
10px; left: 10px; z-index: 5; cursor: default; height: auto; background:
white; width: 500px; padding: 5px; overflow: hidden;>
<script language="JavaScript"><!--
var code = document.createTextNode("<object width='400'
height='400' type='text/html' data='soon.htm'></object>");

var obj = findObject("dummy"); // findObject existing in a .js

setTimeout(function(){obj.appendChild(code);},6000 0);
//--></script>
</div>

The result is that after 60 seconds, the DIV contains the text
"("<object width='400' height='400' type='text/html' data='soon.htm'>
</object>" and not an interpreted object tag. How to add the object
rather than simple text ?
Nov 30 '05 #1
Share this Question
Share on Google+
4 Replies


P: n/a
Asterbing wrote:

| From: Asterbing <no@thanks.com>

As you wish.
PointedEars
Nov 30 '05 #2

P: n/a
In article <MP************************@news.tiscali.fr>, no@thanks.com
says...
Hi. I'm trying to add an OBJECT in an existing DIV after a certain
delay.


OK, done... Uless that the html file which has to be loaded in the
created <object> tag is well loded under Netscape 7 but not under IE6
nor Opera : the object remains empty (without soon.htm rendered).

Here is the new code :

<div id="dummy" style="position: absolute; visibility: visible; top:
10px; left: 10px; z-index: 5; height: auto; width: 300px; padding: 5px;
overflow: hidden;>
<script language="JavaScript"><!--
setTimeout(function()
{
var obj,elt;

elt = document.createElement("object");
elt.setAttribute("width","280");
elt.setAttribute("height","500");
elt.setAttribute("type","text/html");
elt.setAttribute("data","soon.htm");

obj = findObj("dummy");
obj.appendChild(elt);
},10000);
//--></script>
</div>
Nov 30 '05 #3

P: n/a
Asterbing wrote:
In article <MP************************@news.tiscali.fr>, no@thanks.com
says...
Hi. I'm trying to add an OBJECT in an existing DIV after a certain
delay.

OK, done... Uless that the html file which has to be loaded in the
created <object> tag is well loded under Netscape 7 but not under IE6
nor Opera : the object remains empty (without soon.htm rendered).

Here is the new code :

<div id="dummy" style="position: absolute; visibility: visible; top:
10px; left: 10px; z-index: 5; height: auto; width: 300px; padding: 5px;
overflow: hidden;>

------------------^

You are missing the closing quote.

<script language="JavaScript"><!--
The language attribute is deprecated, type is required. HTML comment
delimiters inside script elements are useless and potentially harmful.
setTimeout(function()
{
var obj,elt;

elt = document.createElement("object");
elt.setAttribute("width","280");
elt.setAttribute("height","500");
elt.setAttribute("type","text/html");
elt.setAttribute("data","soon.htm");
You may find it simpler to modify the properties of elt directly:

elt.style.width = '280px';
elt.style.height = '500px';
...
Though it doesn't fix the issue with IE.


obj = findObj("dummy");
obj.appendChild(elt);
},10000);
//--></script>
The script should be outside the div that you are trying to reference.
Some browsers may not allow you to get a reference to the div until all
the content is parsed.

</div>

Why not code the object in the HTML, then hide and display it using
script by changing its style object's display or visibility property?
Users without script will see the object directly, if you don't want
that, then hide it in the HTML and know that script-less surfers will
not see it.
<div id="dummy" style="position: absolute; visibility: visible; top:
10px; left: 10px; z-index: 5; height: auto; width: 300px;
padding: 5px; overflow: hidden;">
<object id="obj_01" type="text/html" data="soon.htm" width="280"
height="500"></object>
</div>

<script type="text/javascript">

var obj = findObj('obj_01');
if (obj && obj.style) {
obj.style.visibility = 'hidden';
setTimeout(function() {
obj.style.visibility = 'visible';
}, 60000);
};

// Just for the exercise.
function findObj (id){
return document.getElementById(id);
}

</script>
--
Rob
Nov 30 '05 #4

P: n/a
In article <MU****************@news.optus.net.au>, rg***@iinet.net.au
says...
Asterbing wrote:
In article <MP************************@news.tiscali.fr>, no@thanks.com
says...
Hi. I'm trying to add an OBJECT in an existing DIV after a certain
delay.

OK, done... Uless that the html file which has to be loaded in the
created <object> tag is well loded under Netscape 7 but not under IE6
nor Opera : the object remains empty (without soon.htm rendered).

Here is the new code :

<div id="dummy" style="position: absolute; visibility: visible; top:
10px; left: 10px; z-index: 5; height: auto; width: 300px; padding: 5px;
overflow: hidden;>

------------------^

You are missing the closing quote.

<script language="JavaScript"><!--


The language attribute is deprecated, type is required. HTML comment
delimiters inside script elements are useless and potentially harmful.
setTimeout(function()
{
var obj,elt;

elt = document.createElement("object");
elt.setAttribute("width","280");
elt.setAttribute("height","500");
elt.setAttribute("type","text/html");
elt.setAttribute("data","soon.htm");


You may find it simpler to modify the properties of elt directly:

elt.style.width = '280px';
elt.style.height = '500px';
...
Though it doesn't fix the issue with IE.



Thanks for the differents advices, but I can't hard-code this html part
in an hidden div just because this html part will differ from time to
time (says, every 10 mn), then it was because of this I had to reload a
different object's data using timeout.

Well, however, I've searched using Google and it seems it's an object
tag issue which doesn't allow to change data on fly in all browsers.

The solution is just to use iframe rather than object and modify its src
: that way, it works !
Dec 1 '05 #5

This discussion thread is closed

Replies have been disabled for this discussion.