Using Flash as HTML background image?

Can I use a SWF as a HTML background image?
I've tried this a couple of different ways...
Any tricks to make this work?

davidlieb wrote:
> Can I use a SWF as a HTML background image?
No, you can't use SWF in html background.
The background does not allow any active content.
Best Regards
Urami
!!!!!!! Merry Christmas !!!!!!!
Happy New Year
<urami>
If you want to mail me - DO NOT LAUGH AT MY ADDRESS
</urami>

Similar Messages

How do you prevent the spry menu from using the main css background-image?

(Dreamweaver CS5. Problem seems not to be browser specific)
I added some code I found online to my main css file in order to allow a custom icon to be used as a bullet in unordered lists, sitewide. It was added before the "body,td,th {" line.
The problem is that the same icon now appears on the upper left hand corner of each main menu segment; not on any submenus or during any mouse states. Just the main at-rest bar.
I know this is somehow related to spry itself being a list, but how do I keep it from showing the background image of the main css file?
Thanks!
This is the site http://www.usc.edu/org/seagrant/NS/
The code which was added to the css file is shown below:
ul{
    list-style:none;
    margin:0 0 1em 15px;
    padding: 0;
ul li{
    line-height:1.3em;
    margin: .25em 0;
    padding: 0 0 0 15px;
    background:url(../Images/Compass_Website_small_2-4-11.png) no-repeat 0 4px;
li ul{
    margin:0 0 0 30px;
    list-style:disc;
li ul li{
    padding-left:0;
    background:none;
li ul li ul{
    margin:0 0 0 30px;
    list-style:circle;
ul li ul li ul{
    padding-left:0;
    background:none;
/* Holly Hack to fix ie6 li bg */
/* Hides from IE-mac \*/
* html li{height: 1%;}
/* End hide from IE-mac */
@media print{
ul {
    list-style:disc;
    margin-left:30px;
ul li {
    padding-left:0px;
    background:none;
} /* end print */
body,td,th { - etc...

Add/modify the following to your document
ul.MenuBarHorizontal li {
    background: rgba(0,0,0,0.0) url(none);
Gramps

HTML background image stops being replicated in long page

This is a straight HTML (no JavaScript, no CSS) page with a tiled background image (128x128 pixel JPEG). After about 2/3 of the roughly 3,000 lines of this page the background image stops, with a smooth horizontal divide: the tiled image background above, and a white background below. The discontinuity moves up and down some while scrolling this page, but remains a clean horizontal break.
This is new behavior with Firefox 7. The background image was displayed throughout the full page with Firefox 6 and earlier.

Hi vestibule, the home page renders out to 42072.5px tall, and Firefox has a bug that limits backgrounds to a height of approximately 32735px tall. See [https://bugzilla.mozilla.org/show_bug.cgi?id=671302 Bug 671302 – cairo-gdi: large background-images and gradients don't work beyond ~ 32735px].
This bug is coming up on a year old and for some reason hasn't been fixed yet, perhaps because such long pages are relatively rare on the web. ??
Until that is resolved, to make the "transition" less jarring, you can add a matching background color (this is the closest I can come up with at the moment):
<br>body {
background-image: url(Image_Files/parchmnt.jpg);
background-color: #f8f8d4;
}

Using Flash and HTML with Sound

Hi All,
I'm a bit of a beginner when it comes to Flash and want to
start using it a bit more but I'm in 2 minds as to which way to
build my site.
I would love to have the functionality still of html and
place the odd bits of Flash in on the site or just create a flash
site but place each page into a seperate html page but there are
issues with the sound. I want ongoing music to be playing but the
tutorials I have looked at seem to lead to a stop start problem
when the visitor clicks from page to page. I want to make it a
search engine friendly as possible which is why one of my options
is to put build seperate html pages for my Flash instead of having
just one.
There may be some coding issues with a couple of pages that
link into databases and I would have to link these pages to pure
html pages for functionality purposes but this would need to be
done either way.
Can anyone advise which way I should go with this and if
there is a solution to the stop, start sound issues with loading
individual pages.
Any help or advice would be hugely appreciated.
Thankyou in advance
Stephen

It works when you put it online... :)1

After changing a Standard-User-Account to a Microsoft-User-Account, does the OS UPLOAD (to cloud) all images in the folder used to hold all background images? Or, maybe, just the first 2 (or 20...)?

TIA.

Hi,
In Windows 8, 8.1, User can use Microsoft Account to login system. This account can be use to sync its user setting, profile, such as background, IE history. that's to say, when you login another Windows 8 or 8.1 system, If your computer connected to Internet,
it would sync your User setting and profile to this second system.
Roger Lu
TechNet Community Support

Capture image with webcam using flash and sending it to the server

I have a need to use flash to capture an image and have that image uploaded to the server. I have seen some examples of code that uses flash to capture an image but it saves the file locally. We need that file to be sent to the server. We are using CF9.0 and I figure that once we are able to capture the image we could hand it off to ColdFusion to send to the server.
Has anyone done anything like that or know if it's possible?
Any help is apprecaited.
Thanks,
Mallory

It's not that hard...after you capture the image in Flash encode just send it via Remoting to a cfc as a bytearray or a bytearray encoded as Base64 string (and then decode it to binary in the CFC). I have had better luck with the latter way. You could also post the bytearray encoded as a Base64 string to a .cfm page as a form field.
For example in Action Script 3 you do something like this (assuming "frameBMD" is the BitmapData drawn from the video source):
var ba:ByteArray=com.adobe.images.PNGEncoder.encode(frameBMD);
var baAsString:String=com.dynamicflash.util.Base64.encodeByteArray(ba);
var saveImageResponder:Responder=new Responder(onSaveImageResult,onFault);
var rs=new NetConnection();
rs.objectEncoding=flash.net.ObjectEncoding.AMF3;
rs.connect("/flashservices/gateway");
rs.call("Headshot.saveImage",saveImageResponder,baAsString,1);
And your cfc would be something like this:
<cfcomponent displayName="Headshot" hint="Save a Headshot">
<cffunction name="saveImage" access="remote" output="false" returntype="string" roles="user">
<cfargument name="data" type="string" required="true" />
<cfargument name="user_id" type="numeric" required="no" default="1">
<cfset SavePathParent = ExpandPath("/data/users")>
<cfset SavePath = SavePathParent & "/user_" & arguments.user_id>
<cfif NOT DirectoryExists(SavePath)>
<cfdirectory action = "create" directory = "#SavePath#" mode="777">
</cfif>
<cfset theFilePath="#SavePath#/headshot_#arguments.user_id#.png">

<cffile action="write" file="#theFilePath#" output="#toBinary(arguments.data)#"/>
<cfset LOCAL.file_url="/data/users/user_#arguments.user_id#">
<cfreturn LOCAL.file_url/>
</cffunction>
</cfcomponent>
Anyway, that's the idea... hope that helps.

Flash as a background

i have seen a numer of sites which use flash as a background
here is just one example but i know of many others
http://sulake.com/blog/entries/2010-06-02-Virtual_thieves_caught_in_Habbo_Hotel_Finland.ht ml
in the past i have seen comments on this forum that say that it is a complex thing to do and noththing else.
can people give me links to in depth tutorials about how to set flash as a background
and i dont mean using absolute positioning to place things on top of flash.

Hi Murray
See - http://www.pziecina.com/test_ideas/swfbg_test.html.
You will have to resize your browser slightly to see the effect, (1px will do).
I have not included the javascript to resize the flash background, nor the actionscript for the maintaining of the aspect ration, (did this in a personal trial project so it does work, see para below).
If you look at the html code you will no doubt recognize the div hack for such things, but now we have animated svg's that can be used as backgrounds and resizeable static background images I decided to abandon the idea, was never really an option in my honest opinion though, for the reasons previously stated.
PZ
Forgot to add Murray - the original swf was 320pxx350px, and I did not up-size this so please ignore the quality.
Message was edited by: pziecina

Setting background image in JFrame

Witam,
Jak mozna ustawic tlo w postaci grafiki (png, jpg, ...) dla jFrame? Znalalem juz kilka sposobow ale one uzywaja jPanel, ktorego ja NIE moge uzyc ... niestety. Jesli nie ma takiej mozliwosci dla jFrame to moze tez byc dla jScrollPane, JComponent, Scene albo LayerWidget;)
Hi,
Is it possoble to use image as a background for jFrame? I know that it is possible to use jPanel and ser background image for jPanel, but in my project I cannot use it. Instead I can use jFrame, jScrollPane, Scene or LayerWidget.:)

In the future, Swing related questions should be posted in the Swing forum.
But there is already no need to post in the Swing forum because you already know the answer:
I know that it is possible to use jPanel and ser background image for jPanel,
If you need further help then you need to create a "Short, Self Contained, Compilable and Executable, Example Program (SSCCE)", that demonstrates the incorrect behaviour.
http://homepage1.nifty.com/algafield/sscce.html
Don't forget to use the "Code Formatting Tags", so the posted code retains its original formatting.
http://forum.java.sun.com/help.jspa?sec=formatting

Inserting a Spry Accordion on top of a background image?

I created an 800 x 600 pixel graphic image in Adobe Photoshop CS4 to be used as an overall background image for a webpage. I also created a few navigation links from the image Layers using the Slice Select Tool, then optimized and saved the image as an html file using the Save for Web & Devices command in Photoshop. Next, I opened the html file in Dreamweaver CS4.
Is it possible to insert a Spry Accordion with a clear (transparent) background anywhere on top of that background image in Dreamweaver CS4 so that I can see the background image behind the text content of the Spry Accordion? I use Windows Vista.

Hi,
Yes, as is shown by the following code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script src="SpryAssets/SpryAccordion.js" type="text/javascript"></script>
<link href="SpryAssets/SpryAccordion.css" rel="stylesheet" type="text/css" />
</head>
<body style="background: url(images/detail/cd1.jpg) no-repeat center;"> //use your own location and file
<div id="Accordion1" class="Accordion" tabindex="0">
<div class="AccordionPanel">
    <div class="AccordionPanelTab">Label 1</div>
    <div class="AccordionPanelContent">Content 1</div>
</div>
<div class="AccordionPanel">
    <div class="AccordionPanelTab">Label 2</div>
    <div class="AccordionPanelContent">Content 2</div>
</div>
</div>
<script type="text/javascript">

</script>
</body>
</html>

Background image displays locally in HTML5 template but not when published

I have used an excellent HTML5 template which uses JavaScript to display background images. However while this file works locally it doesn't when published. The site structure is sound and I notice this happens with the source files I downloaded also so it's nothing I have done in my build which could have caused this.
This is the link to my site, everything is fine except the background image not showing.
http://www.khawkinsdesign.com
Any ideas, as I say fine locally, not fine when published?
Message was edited by: Kyle Hawkins

Hi Kyle,
I realise you posted your question a couple of days ago but it looks like your background image issue may now be fixed?
In any case, your site has a few issues. Not sure who told you the template was HTML 5 but they might be yanking your chain. There is nothing HTML 5 about the code used and the DOCTYPE is from HTML 4. As such, some of the code you have used is throwing up errors - some related to the DOCTYPE and some where you haven't closed the tags:
http://validator.w3.org/check?uri=http%3A%2F%2Fwww.khawkinsdesign.com%2F&charset=%28detect +automatically%29&doctype=Inline&group=0
<ul id="footer-nav">
<li><a href="index.html">Home</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li><a href="about.html">About</a></li> /*The closing tag is missing in your code */
<li><a href="contact.html">Contact</a></li> /*The closing tag is missing in your code */
</ul>
It would be best to amend the errors but some might disappear when you add the HTML 5 DOCTYPE in to your code. Things like your lack of "type" on the sources is a required v4 attribute, but not in v5.
<!DOCTYPE html>
Have a read through this for more info - this is a great resource for everything HTML 5. http://diveintohtml5.info/
Rik
EDIT:// It seems that the DOCTYPE is the 5 version on all but the home page so you may only have one to correct. However, there are still no HTML 5 elements used to take advantage of the new DOCTYPE.

Background Image Cuts Off - Browser Scroll Isn't Long Enough

Okay, fairly new to Dreamweaver, long-time graphic designer. That said, the answer will probably be easier than trying to explain the problem!
Using the Page Properties, I set the following in the Appearance (CSS) tab:
Background color to #000
Appearance HTML Background image (contains the image in question, created in Photoshop)
No-repeat
This Photoshop image is kind of long (960 x 2232) because there is a bunch of text that needs to flow on top. I thought that I reached some sort of maximum in height and so I reduced the height of the image a little and the same problem--cut off at the bottom of the browser. Note that this cut off issue was not a problem until I extended the graphic to this long length. On other pages, it is much shorter and all is well.
I've pasted a snapshot of the bottom of the web browser preview below. You can see that the scroll bar is at the bottom and there is just a small bit of the paper that is not showing. I would like the bottom of the paper to be seen with a little bit of the black background beneath that.
My first instinct is that I'm missing a bottom padding effect, but can't find where to adjust that type of setting.
Another Thought--I would much rather this graphic auto expand as the text flows over it, but did not know how to accomplish that, so I extended the graphic in the Photoshop file. Its not a tile type of image that can be repeated. It is an ancient looking paper, therefore, the top and bottom need to look a certain way, but the mid section could be tiled and repeated. So if this is a better route, please direct me on where to learn how to implement.
Thanks a bunch!

extra carriage returns were needed in the text frame to extend below the background image.
Rule #1 in web design:
Do not use non-breaking spaces, line breaks or empty <p> tags as a layout device. It doesn't work in all devices or by all users.
Rule #2 in web design: Use CSS to style your layout with margins, padding and min-height properties.
HTML & CSS Tutorials - http://w3schools.com/
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb

Responsive Background Images with Media Queries

Hello,
I'm creating a mobile website in Dreamweaver and would like to use an image which will change with different device widths. I'm using media queries with background images. My problem is that in order for the background images to display, I need to assign a height to the div. When the image is scaled down the height stays static, leaving white space beneath it. There will be content below the image so the white space will push it down and look wrong. Is there a way to use multiple images with media queries keeping the height responsive? Thank you!
@media screen and (max-width: 1024px) {
#mainImage {
          background-image: url(../images/mainImageLarge.jpg);
          background-repeat: no-repeat;
          background-position: center top;
          background-size: 100%;
          height: 272px;
          border-top-width: 3px;
          border-top-style: solid;
          border-top-color: #FFF;
@media only screen and (max-width : 480px) {
#mainImage {
          background-image: url(../images/mainImageMed.jpg);
          background-repeat: no-repeat;
          background-position: center top;
          background-size: 100%;
          height: 107px;
          border-top-width: 3px;
          border-top-style: solid;
          border-top-color: #FFF;
@media only screen and (max-width : 320px) {
          #mainImage img {
          background-image: url(../images/mainImageSmall.jpg);
          background-repeat: no-repeat;
          background-position: center top;
          background-size: 100%;
          height: 150px;
          border-top-width: 3px;
          border-top-style: solid;
          border-top-color: #FFF;

Like this example:
http://alt-web.com/FluidGrid/Fluid-4.html
METHOD:
Insert 2 images -- one for desktops and one for mobile. Assign classes to each image.
<img id="banner" class="desktop" src="desktop_image.jgp" />
<img id="banner" class="mobile" src="mobile_image.jpg"/>
In your CSS, use display:none and display:block to show/hide.
.desktop {
    display:block;
.mobile {
    display:none;
/* Special Rules for mobiles */
@media only screen and (max-width: 480px) {
    .desktop {display:none}
    .mobile {display:block}
Feel free to set your break points however you wish.
Nancy O.

Background image duplicating

Hi
I am very new to this and I built and uploaded a very simple site using dreamweaver. The background image duplicates and I want it to only be one copy and fill the entire background of the page.
I saw answers were some coding is used, but I have no idea where to go to put the codes. Could someone give me step by step instructions on how to show one image in the background?
The website I am refering to is www.healthyheartsoaringsoul.ca
Thank-you!
Ruth

Text is centered and so is the page. Preview in browser or use Live View. Design view is not 100% reliable.
The CSS for centered text is this:
table {
text-align:center;
Please review HTML & CSS basics first. It will make learning to use Dreamweaver much easier.
HTML & CSS Tutorials - http://w3schools.com/
Centering Pages, Images and other elements with CSS
http://cookbooks.adobe.com/post_Centering_web_pages_and_other_elements_with_CSS-16640.html
Adobe TV - Learn DW CS5 (video tutorials)
http://tv.adobe.com/show/learn-dreamweaver-cs5/
Creating your first web site in DW CS5 -
http://www.adobe.com/devnet/dreamweaver/articles/first_website_pt1.html
Using DW Starter Pages
http://www.adobe.com/devnet/dreamweaver/articles/introducing_new_css_layouts.html
Good luck,
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb

How do I keep the body background-image centered?

I have a body background-image that does not fill up the
entire window on the tops and bottoms of most monitors (it
strectches to the left and right just fine) and so I would like to
have it centered vertically with equal amounts of the
background-color #ECE5C8.
I assumed using background-position: 50% 50% would do the
trick and it does until switching to full screen mode and all the
content jumps upwards and messes up the whole site layout (IE
only-in friefox, the background-image still doesn't center) so
instead I have the background-position set to: 50% 0%.
Thanks a million to anyone who can help me get it centered, I
know there has to be an easy fix but I sure can't figure it out!
The site can be found here:
http://www.lightspacewebdesign.com/sacredsolas

There would be only two ways to make this layout 'work'.
1. Just make everything on that page a graphic. Then there is
no
possibility that resizing the text in the browser will blow
the layout.
This is a very bad idea for obvious reasons.
2. Have the text containing 'graphical box' built in pieces
so that as the
text expands, it can cause the box to expand as well. The
easiest way to do
this is with a top a middle and a bottom image of the box,
using each as the
background image of three stacked containers. Place the text
in the middle
container and as it expands, it will tile the middle
background image
vertically to give the impression of the box expanding. This
approach
doesn't lend itself to your background image, since there is
no way to tile
the background image to fill the newly created space.
Beyond that, I think you are a dead duck. The problem is not
that this is
what you were given to work with - it's that you didn't
understand how
unusable the design was when you accepted it. I think your
best option now
is to go back to the designer and explain to them how this
lovely layout
only works well in print, and not on the web. Show them how
it fails.
Solicit suggestions from them for how to make it work in a
medium where
there is no way to control the size of the text.
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"afriendofcheese" <[email protected]> wrote
in message
news:[email protected]...
> By "a rigid layout scheme that cannot allow flexibility"
I assume you mean
> that
> everything shouldn't be bound inside the position of the
background-image,
> but
> this is what the designer and client gave me to work
with.and so I have to
> make
> due.
>
> With that in mind, I hope someone out there can help me
out with this!
>

Can't get rid of background image of toolbar buttons

I am just a front-end developer and responsible for the front-end look of an ADF application that we are creating: We are using jDeveloper 11.1.1.4.0 (and we cannot upgrade due to being told no...so I cannot USE the skin editor which when I tried to use, migrates the files).
I have created the necessary directories and files per tutorials I have been reading up on...
skins directory - (new directory)
skin.css (new file)
Web-Inf -
trinidad-skins.xml (new file and correctly configured)
trinidad-config.xml (existing file but updated to use the new skin)
Within the trinidad-skins.xml file I have the the new skin specified and is extending the "fusionFx-v1.desktop" default theme being used.
Now the problem... I cannot get the background images to be overwritten or disabled for af|toolbar::item within the .css file
I have looked up information about how to overwrite this and I tried to use the
-tr-inhibit: background-image; within the .css declaration like this
<code>
af|toolbar::item {
-tr-inhibit: background-image;
</code>
That was unsuccessful. I even just tried standard background {none;} and that was a no go as wel.
What am I doing wrong here? This is driving me nuts... they made this skinning stuff way too complicated IMO. I don't see why I can't just add a class to the component within the property inspector of that component and then be able to reference it via normal css conventions... but nope BREAKS grrr... And I'm advanced level CSS coder! This stuff has me absolutely clueless and ready to just quit!
Any suggestions or help is appreciated! And again... I cannot use the skin editor! Everytime I tried to, it prompted me to migrate the application and I cannot do this since there are about 5 other developers working on this application (we use clearcase for version control).
Thanks,
Michael

I can't use the stand alone skin editor since it will want me to migrate the project files (developed in 11.1.1.4) and all files are source controlled via ClearCase.
I have been experimenting...This is the code on the .jspx page
<code>
<af:panelGroupLayout id="header" styleClass="headerParent">
<af:panelGroupLayout id="topLinkBar" layout="horizontal" styleClass="topLinkBar AFStretchWidth">
<af:outputLabel value="#{customeradminportalviewcontrollerBundle.CUSTOMER_ACCOUNT}" styleClass="customerLabel"/>
<af:outputText value="outputText2012" styleClass="customerOutput"/>
<af:toolbox id="topLinkToolBox" styleClass="topLinkToolBox">
<af:toolbar id="topLinkToolBar" styleClass="topLinkToolBar">
<af:commandToolbarButton text="#{customeradminportalviewcontrollerBundle.HELP}" id="ctb2"/>
<af:commandToolbarButton text="#{customeradminportalviewcontrollerBundle.POWER_INVOICE}" id="ctb1"/>
<af:commandToolbarButton text="#{customeradminportalviewcontrollerBundle.CONTRACT}" id="ctb3"/>
<af:commandToolbarButton text="#{customeradminportalviewcontrollerBundle.SIGNOUT}" id="ctb4"/>
</af:toolbar>
</af:toolbox>
</af:panelGroupLayout>
</af:panelGroupLayout>
</code>
Here is the CSS code
<code>
#topLinkToolBar af|commandToolbarButton {
background-image: none;
background-color: transparent;
border: 0;
</code>
That WILL NOT get rid of the background images on the buttons! However if I do the !important hack within the CSS like this:
<code>
#topLinkToolBar af|commandToolbarButton {
background-image: none!important;
background-color: transparent!important;
border: 0!important;
</code>
Then BOOM it works... I do NOT want to use the !important hack since that will cause problems in CSS inheritance and cascading...
What am I doing wrong?
Also how do I (if possible) target a specific ID used? For example the af:toolbar has an ID of "topLinkToolBar" how can I target that within the CSS? I know I can target it via class attribute like this:
<code>
af:toolbar.topLinkToolBar
</code>
but how would I do the same if I wanted to only apply to a component with a particular ID?
Thank you everyone for all your patience, suggestions and help with this... I'm totally new to this type of environment and it's been a slow and frustrating learning experience!
Michael

Using Flash as HTML background image?

Similar Messages

Maybe you are looking for