object doesn't support property or method

Hi, I am developing an ad for a client of our. This ad is placed over all the content on a site. But also has a close button. I have made a close function, but when I click it, I get the object doesn't support property or method error.


var styleSheet;
if (document.styleSheets) {
if (document.styleSheets.length === 0) {
var styleElement;
if (document.createElement && (styleElement = document.createElement('style'))) {
styleElement.type = 'text/css';
document.getElementsByTagName('head')[0].appendChild(styleElement);
styleSheet = styleElement.sheet;
}
}
if (document.styleSheets.length > 0) {
styleSheet = document.styleSheets[document.styleSheets.length - 1];
styleSheet.addRule("body", "background-color:#ffffff;",-3);
styleSheet.addRule("body", "margin:0;height:100%;overflow-y:auto;padding: 0 16px 0 0;",-2);
styleSheet.addRule("#hockeystick", "display:block;top:0px;left:0px;width:100%;heigth:100%;position:fixed;z-index: 9999;visibility:visible;",-1);
styleSheet.addRule("* html #hockeystick", "position:absolute;",0);
styleSheet.addRule("html", "overflow-x:auto; overflow-y:hidden;",1);
}
}


var sCreative='<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="100%" height="100%"><param name="movie" value="hockeystick.swf?clickTag=http://www.test.nl" /><param name="quality" value="high" /><param name="wmode" value="transparent" /><param name="SCALE" value="exactfit" /><embed src="hockeystick.swf?clickTag=http://www.test.nl" width="100%" height="100%" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" wmode="transparent" scale="exactfit"></embed></object>';
//document.body.innerHTML = document.body.innerHTML + sCreative;

document.write('<div id="hockeystick">');
document.write(sCreative);
document.write('<\/div>');


function CloseHockeystick(){
hockeystick = document.getElementById('hockeystick');
//alert(hockeystick);
hockeystick.style.display = "none";
}

Does anyone have any idea on how to fix this???

thanks :thumbsup:

Hi Mauzzie,

function CloseHockeystick(){
hockeystick = document.getElementById('hockeystick');
//alert(hockeystick);
hockeystick.style.display = "none";
}

Why are you doing it this way?

Surely it would be simpler to write:

function CloseHockeyStick()
{
hockeystick.style.display = "none"; //You're already referencing the id of the element here unless I'm missing something? This may cause probs :)
}

Cheers
Joe

Hi Joe,

When i use this, I still get an error, saying object expected. I think it might be have something to do with the object being rendered with the document.write method. I do not really understand if I can access it this way and how I can check it position in the DOM....

Do you have any idea?

Hey Mauzzzie,

Use DOM?

How about using document.createElement to create the div, then append it to the doc using appendChild(). Like so:

hStick = document.createElement("DIV");
hStick.setAttribute("id", "hockeystick");
hStick.setAttribute(blah, whatever)....and so on

Once you finish setting attributes you can then append it to a parent element with appendChild().

To append it to the body you would write:

document.body.appendChild(hStick)

Then you can reference its id as you've set it up in the statements above.

HTH
Joe

thnx Joe, works like a charm!