Home >Web Front-end >HTML Tutorial >Detailed explanation of inserting flash code into html (reprint)_html/css_WEB-ITnose
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6, 0,40,0" WIDTH="550" HEIGHT="400" > <PARAM VALUE="myFlashMovie.swf"> <PARAM VALUE=high> <PARAM VALUE=#FFFFFF> <EMBED src="/support/flash/ts/documents/myFlashMovie.swf" quality=high bgcolor=#FFFFFF WIDTH="550" HEIGHT="400" NAME="myMovieName" ALIGN="" TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer"></EMBED></OBJECT>
Explanation:
The OBJECT tag is used in windows IE3.0 and later browsers or other browsers that support Activex controls. The "classid" and "codebase" attributes must be written exactly as shown in the example above. They tell the browser the address to automatically download the flash player. If you have not installed flash player, browsers after IE3.0 will pop up a prompt box to ask whether you want to automatically install flash player. Of course, if you don't want users who don't have flash player installed to automatically download the player, maybe you can omit these codes.
EMBED tag is used in Netscape Navigator 2.0 and later browsers or other browsers that support Netscape plug-ins. The "pluginspage" attribute tells the browser the address to download the flash player. If the flash player has not been installed, the user needs to restart the browser after installation to use it normally.
To ensure that most browsers can display flash normally, you need to nest the EMBED tag within the OBJECT tag, just like the above code example. Browsers that support Activex controls will ignore the EMBED tag within the OBJECT tag. Netscape and IE browsers using plug-ins will only read the EMBED tag and will not recognize the OBJECT tag. In other words, if you omit the EMBED tag, then Firefox will not be able to recognize your flash (but what is surprising is that if you omit object and only write embed, IE can display flash normally, haha, let’s take a closer look) .
This article lists the required and optional attributes of the OBJECT and EMBED tags used to publish videos.
1. Required attributes:
·CLASSID-Set the browser's Activex control, only used for OBJECT tags, class ID, ActiveX component id, used in Find the corresponding component in the registry.
·CODEBASE-Set the location of the flash Activex control, so that if the browser is not installed, it can be automatically downloaded and installed. Only used for OBJECT tags.
·WIDTH-Specify the width of the flash video in percentage or pixels.
·HEIGHT-Specify the height of the flash video in percentage or pixels.
·SRC-Specify the download address of the video. Only for EMBED tags.
·PLUGINSPAGE-Set the location of the flash plug-in, so that if the browser does not have it installed, it can be automatically downloaded and installed. Only for EMBED tags.
·MOVIE-Specify the download address of the video. Only used for OBJECT tags.
2. Optional attributes and available values:
·ID-Set variable name for reference in script code. For OBJECT only.
·NAME - Set the variable name for reference in script code (such as javascript). For EMBED only.
·SWLIVECONNECT - (true or false) Specifies whether to enable java when the flash player is downloaded for the first time. If these attributes are omitted, the default value is false. If you use javascript and flash on the same page, java must use FSCommand to work.
·PLAY - (true or false) specifies whether the flash video will automatically play after downloading is completed. If this attribute is omitted, the default is true.
·LOOP - (true or false) specifies whether to stop or continue looping after the last frame of the video. If this attribute is omitted, the default is true.
·MENU - (true or false)
·True displays all menus, allowing users to zoom in, zoom out, etc. to control video playback and other operations.
·False displays only the menu containing setting options and about flash.
·QUALITY - (low, high, autolow, autohigh, best)
·Low is faster than beautiful and does not apply anti-aliasing.
·Autolow focuses on speed at the beginning, but can always improve the beauty when needed.
·Autohigh focuses on both playback speed and aesthetics, but sacrifices aesthetics to ensure playback speed when necessary.
·Medium applies some anti-aliasing without smoothing the bitmap. Its quality is higher than the low setting and lower than the high setting.
·High Beauty is better than playback speed, and anti-aliasing is always applied. If the movie does not contain animation, the bitmap will be smoothed; if the movie contains animation, the bitmap will not be smoothed.
·Best provides the best display quality regardless of playback speed. All output has anti-aliasing applied and all bitmaps smoothed.
·SCALE - (showall, noborder, exactfit)
·Default (Show all) The video is displayed in the specified area but maintains the original proportion. Borders will appear on both sides of the video.
·No Boder shrinks the video to fit the specified area, keeping the video undistorted, but part of the video may be cropped. However the original proportions of the film are maintained.
·Exact Fit causes the entire video to be displayed within a specified area. The video may be deformed and distorted, and the original proportions may not be maintained.
·ALIGN - (l, t, r, b)
·The default is centered. When the browser window is smaller than the video, the edges will be cropped.
·Left, Right, Top, Bottom are aligned along the edge of the browser according to the corresponding settings. If necessary, the other three sides will be trimmed.
·SALIGN - (l, t, r, b, tl, tr, bl, br)
·L,R,T,B
·TL,TR
·BL,BR
·WMODE- (window, opaque, transparent) Set the window mode attribute of the flash movie and specify the transparency, cascading and position of the flash in the browser.
·Window The video plays in its own rectangular window in the browser.
·Opaque video hides all the content behind it.
·Transparent makes the flash video transparent and displays the web content behind the transparent video. This will reduce animation performance. And this property is not available in all browsers.
·BGCOLOR - (#RRGGBB, hexadecimal RGB value.) Specifies the background color of the video. Use this attribute to override the background color set in flash.
·BASE - Set the base directory or URL to resolve all relative paths in flash. Similar to the dde6fb694e6711ae5e6f381704c04ae4 tag in web pages.
·FLASHVARSTo pass variables to flash player, flash player 6 and later versions are required.
·Pass root-level variables to the video. The format of the string is a name=value set separated by "&".
·Browser supports 64kB string length.
·For more information about FlashVars, please view the related documentation.
Two: Some skills
(1) First, teach you the simplest code to insert Flash, transparent, without coordinate control:
Note that wmode="transparent" controls whether Flash is transparent Displayed, if you don't want it to be displayed as transparent, just remove wmode="transparent".
4e690a49257d431608c1b6760a32f06452bd5fd6675b25168c6220d2fe97dd9b
( 2) Let me teach you how to add transparent Flash with absolute coordinates. Absolute coordinates mean that no matter how big your window is, the Flash will still stay in place
c1a3450b8f3f6637a0186fd8aed5fcba
(3) Finally, I will teach you how to add transparent Flash with relative coordinates. Pay attention to the table part of the code below. This mainly uses the table as a container and "installs" Flash
into the table. In this way, no matter how big the browser is, Flash will always move with the table. Moreover, the table can set a background image, and put a transparent
Flash on top of the table to match the background image. Wow, the effect is amazing
1b222c32b2c01b54efc29c26963b5533
45fed1e228352da0e53d8700bee3f40a75a30b10f6da6aac32551e45771d42468fc51b78fa691bb916a6e7faa81728a1b90dd5946f0946207856a8a37f441edff16b1740fad44fb09bfe928bcc527e08
------------------------- ---------------------------------- ------
There are also the following Method:
Implementation method based on web page layout
You can first prepare a picture and a flash suitable for transparency effects, then open a new web page in DREAMWEAVER and insert a row and column
cell, the size of the cell is the same as the width and height of the picture prepared in advance, and then set this picture as the background picture of the cell. After setting, insert the prepared
into this cell. flash, the size of the flash should also be adjusted to the same size as the cell. After selecting flash with the mouse, switch the web page editing status from "Design"
to "Code". You will see that the flash part has turned black in the source code. The code example is as follows:
19dab8543298dff9f3e322a6334873a6
b53e7e502db905f0bd32676efa0edf41
c8c599763c7a1992df9f4141a612b681
52ad2387065b04d9b095a5d9dd8bf9244dd31068bf220ff9da7a2b5fbd47a26a
eb50c9ec568c9b96871b9e94a1ff3fd1
Insert this piece of code into the above code: 2f389c5d976adc5aab97269c758b7bfd, the complete code is as follows:
ae819c3a991c38b71973563723ee6694
b53e7e502db905f0bd32676efa0edf41
0fe1dd7617fbe698eb05b5f7d40122fe
c8c599763c7a1992df9f4141a612b681
ae24733343b3b242842c10bcdc1d3efe4dd31068bf220ff9da7a2b5fbd47a26a
eb50c9ec568c9b96871b9e94a1ff3fd1
Grasp the core idea based on CSS layout, insert flash into the DIV tag with the background image, and then add the above code to the flash part.
Select windows mode/t ransparent
windowless in the html publishing option of flash, publish it as html, and insert it into the web page to get the transparent flash effect.
Yes, if you follow this method, you can publish an HTML page with transparent flash. But there is a problem: the published flash animation only displays a transparent effect in the HTML page published at the same time as
. If you use Dreamweaver to create a new file, insert it into the page, and save-->&g
t;f12 preview we will find that it is opaque again! What's going on?
I carefully compared the source code of the html page published with flash and the two html pages with flash animation produced with dreamweaver:
1. The source code of the html page published with flash :
6a74014ee44f5deb5894267f99b68016
ef1cac8df639bc9110cb13b8b5ab3dd7
08eb756f81b28a01d33212cce3fbe742Movie20e94189e2178ffcfb346fb78b3f60691
34934661d7147ca926b095899343bad0
005797f4a16371d287a7e28c7a658fbb
6de3f4dacec4b6de39daeedf72180dfc
0640d7fa7b88acc6274cc204d2860005 ;
7f7d973f7fc61953b2bbfd22fd08571a
7cadccb8a1867f7d5da6037d81d4564a
08b66ec4c460e1cb837a4254703b2489
6b8ea03dd539eb1a5245ed481ab501b3
de6f85b03bef6b1f1b0d2d319008ec77 6fea484e976c928c633f76dcc0d4a476
78458b55c07d8af4c860b593268ee36517f234e5eaf687924a37be389ca021b6
9572cdfa094ffb0c87adf52aa40c3069
f2475bc0d02a524246eacdb398ec424e
619a731b06d1d0774fedf2be789fc634
b2386ffb911b14667cb8f0f91ea547a7Untitled document6e916e0f7d1e588d4f442bf645aedb2f
18d371e3d0ab9ec49d2a2578564745a5
9c3bca370b5104690d9ef395f2c5f8d1
fce836d4df70ff488f9a9b2643b4d2563506c30a2ac238b5ad6610e5e8d4143e
Please think about the flash properties panel of Dreamweaver. Do you have any impression of parameter? Does everyone know its use?
Now let us use Dreamweaver to create a transparent effect: select the flash animation you just inserted, right-click the mouse and select properties to bring up the
properties panel, then click the parameter button, in the pop-up dialog box Click the plus sign icon, type wmode in the parameter on the left, type transparent in the value box of on the right, click ok, press f12 to preview, ok! The transparent effect we want appears!
Don’t get excited yet, let’s generalize this technique. Will it work for any animation based on the default settings of flash (that is, without modifying windows mode/tr ansparent
reamweaver, setting properties→parameter→wmode→
value=transparent can achieve the transparent background effect of flash.
-------------------------------------------------- -------------------------------------------------- ---------------
01c405bc676a2af1bc5efe480b79f990
b89d47eb9b48f07193d40b54929c4326
c8c599763c7a1992df9f4141a612b681
fd7b4439eb9f05f1fbc7f1e2b6716ca34dd31068bf220ff9da7a2b5fbd47a26a
eb50c9ec568c9b96871b9e94a1ff3fd1