勉強したことのメモ

Webエンジニア / プログラマが勉強したことのメモ。

Flash上にHTMLのテキストやリンク(aタグ)を重ねる方法

   2024/04/17  CSS

FlashにHTMLで文字を書きたかった。そのまま書くのは無理だろうけどCSSかなにかで重ねられないかと探したところ、良い方法があったのでメモ。

 

サンプル

https://taitan916.info/sample/flashLayer/

 

ソースコード

<html>
<head>
<title>FlashにHTMLリンクを重ねるテスト</title>
<style>

.flash{
    position: relative;
}
.layer{
    top: 0px;
    left: 50px;
    position: absolute;
}

</style>
</head>
<body>
    <h1>FlashにHTMLリンクを重ねるテスト</h1>

    <div class="flash">

        <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="200" height="100">
        <param name="movie" value="test.swf" />
        <param name="wmode" value="transparent" />
        <param name="base" value="." />
        <param name="quality" value="high" />
        <param name="wmode" value="opaque" />
        <embed src="test.swf" base="." wmode="opaque" quality="high" wmode="transparent" 
        pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"
        type="application/x-shockwave-flash" width="200" height="100"></embed>
        </object>

        <div class="layer">
            テストテスト。<br />
            HTML記述。<br />
            <a href="https://taitan916.info/blog/">link</a>
        </div>

    </div>
</body>
</html>

 

その他

paramタグとembedタグのwmodeをtransparentにするのが必要みたい。

ただこれをやっちゃうとIEでは日本語の文字入力領域で日本語が入力できない模様。

http://helpx.adobe.com/jp/flash/kb/228635.html

 - CSS

  関連記事

「slick」でarrows(次に進む・前に戻るボタン)を設定しても表示されない場合の対応方法
「slick」でarrows(次に進む・前に戻るボタン)を設定しても表示されない場合の対応方法

「slick」で画像スライダーを表示する際にarrows(次に進む・前に戻るボタ ...

スクロールしても追尾する要素をプラグイン等は利用せずCSSのみで作成する方法
スクロールしても追尾する要素をプラグイン等は利用せずCSSのみで作成する方法

コンテンツ内をスクロールしても追尾してくる要素を作成したかった。以前にMeeka ...

HTML / CSSで作成したコンテンツをPDFファイルで出力する方法(TCPDF)
HTML / CSSで作成したコンテンツをPDFファイルで出力する方法(TCPDF)

HTML / CSSで作成したコンテンツをPDFファイルで出力させたい。以前mp ...

画像ホバー時にエフェクトを追加したり文字を重ねられる「Izmir」ライブラリの利用方法
画像ホバー時にエフェクトを追加したり文字を重ねられる「Izmir」ライブラリの利用方法

Lightboxを使用しているページで画像をクリックすると拡大表示されることをユ ...

CSSでfloatやmargin&widthは使わずにブロック要素の中央寄せ・右寄せする方法
CSSでfloatやmargin&widthは使わずにブロック要素の中央寄せ・右寄せする方法

CSSでブロック要素を中央寄せする場合はwidth指定しつつ「margin:0 ...