?
Solved

Is it possible to place an image or text over a flash object?

Posted on 2006-07-07
6
Medium Priority
?
1,555 Views
Last Modified: 2008-05-30
I just found out the hard way you can't use a DIV to place text or an image over a flash object.

Is there any way at all to be able to do this?  with CSS or some javascript trick?

thanks.
0
Comment
Question by:Nytrix
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 2
6 Comments
 
LVL 17

Accepted Solution

by:
mreuring earned 300 total points
ID: 17059187
You should just use some CSS for that.
Be carefull though, it also requires a flash-property to be set, this being the wmode, which needs to be set to transparent or alternatively opaque I believe, see example below for a working sample.
<html>
<head><title>html over flash</title></head>
<style type="text/css">
      div#htmlcontent { z-index: 5; border: 1px solid red; position: relative; top: 3em; background: white; }
      div#flashcontent { z-index: 1; }
</style>
<script type="text/javascript">
</script>
<body>
<div id="htmlcontent">htmlcontent</div>
<div id="flashcontent"><object type="application/x-shockwave-flash" data="lighting-button.swf" width="122" height="74">
            <param name="movie" value="lighting-button.swf">
            <param name="wmode" value="transparent">
</object></div>
</body>

</html>

this example can be viewed online (I created it long time ago for the CSS section) :)
http://www.windgazer.nl/eexchange/htmloverflash.html

Greets,

 Martin
0
 

Author Comment

by:Nytrix
ID: 17059758
Ok that's great.  I'll have to tweek this, but it looks like it works, thanks!

Cuz the flash is made transparent, the flash is a dark outerspace thing...stars....

The background of the table in which it resides is set to white.

Making the flash transparent gives the flash a whitish hue to it (blending with the white table bgcolor).

Setting the table backcolor to black seems to help.

BTW, just over your body tag, is this code...

<script type="text/javascript">
</script>

What is this doing?

As well, where does this technically lie (this code) in this document, since the closing </HEAD> tag is placed just after the TITLE tag?

thanks again.
0
 

Author Comment

by:Nytrix
ID: 17059834
By the way, do you know how you would change the font color and face of that text?

Somewhere within here I assume...

<style type="text/css">
     div#htmlcontent { z-index: 5; border: 1px solid red; position: relative; top: 3em; background: white; }
     div#flashcontent { z-index: 1; }
</style>
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

Author Comment

by:Nytrix
ID: 17059863
actually nevermind, i just figured out how to change the text color. :-)
0
 

Author Comment

by:Nytrix
ID: 17059940
The one thing this does seem to do is set the alignment of my flash (within my table) to I guess it's "bottom" or something.  Instead of being center aligned, it's pushed the flash to the bottom of the table.

Is your code overriding my <TD align=center> code? and is there a way to get my flash aligned center again in the table?
0
 
LVL 17

Expert Comment

by:mreuring
ID: 17062852
The code-sample that I provided is just a quick and dirty mock up that I made once upon a time.

The code as it is placed a html text down 3 lines and because the flash is right under it the text gets moved on top of the flash. In essence I would have to have a peek at your html before I could make any recomendations. The most important parts of this example are that the flash gets a setting for wmode and that the text has position, it's not a general copy-paste  piece of coding.

So, a short peek at your page should help me give you a clearer picture of what needs to be tweaked for you.

As to the questions you had already asked:

 - That script block does nothing, it was just there because I used a generic testing template at the time and didn't bother to remove it
    There's no code in this page that does anything, had there been code in that block of javascript it would likely only have been function definitions not accual output.

 - div#htmlcontent is the line that targets the text in this example, but I would need to have a look at your html to give you advice that is more in line with what you accually want.

 - I suppose you probably copy pasted most of the above example streight into your page, it wasn't meant as such, so we'll need to clean it up a bit, that should also give you a bit more control again...
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

In my daily work (mainly using ASP.net), I need to write a lot of JavaScript code. One of the most repetitive tasks I do are the jQuery Ajax calls. You know: (CODE) I don't know if for you it's the same, but for me is soooo tedious to write the …
Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

777 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question