JavaScript Forum

**pealo86** · 07-14-2010, 06:08 AM

I have an <object> element on a website like so:

Code:

<div id="wrapper-splash">
        <object id="splash" type="application/x-shockwave-flash" data="swf/splash.swf" width="750" height="575">
            <param name="movie" value="swf/splash.swf" />
            <param name="wmode" value="transparent" />
        </object>
    </div>

I've tried targeting it with this script:

Code:

<script type="text/javascript">
$(document).ready(function() {
    $('#splash').click(function() {
        $(this).delay(800).remove();
    });
});
</script>

But it doesn't work in either FF or Safari (I assume in doesn't work in any browsers).

The script simply doesn't do anything when the element is clicked.

Does anybody know why this might be?

Thanks

**stbuchok** · 07-14-2010, 07:27 AM

Have you thought about doing this on the div tag instead to see if that works instead?

**pealo86** · 07-14-2010, 07:31 AM

I tried that yes, but it didn't work in FF

**stbuchok** · 07-14-2010, 07:54 AM

This is kinda quick and dirty but the only way I could figure out how to do it in the last 10 minutes was to have an overlaying div on top of the object:

HTML Code:

<html>
<head>

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

<script type="text/javascript">
$(document).ready(function() {
    $('#overlay').click(function() {
        $('#divsplash').delay(800).remove();
        $('#absOverlay').delay(800).remove();
    });
});
</script>

</head>
<body>

<div id="absOverlay" style="position: absolute;">
<div id="overlay" style="position: relative; width: 480; height: 385; border: solid 1px #000000; background-color: #ffffff;"></div>
</div>

<div id="divsplash">
        <object ID="SPLASH" width="480" height="385" style="background-color: #ff0000;">

		</object>
</div>

</body>
</html>