

このプログラムのjavascriptが動いてないみたいで  
透明化されないのですけどもどうしてでしょうか  
おしえてくださいお願いしますm(__)m

[code]

    <html>
        <head>
        <meta http-equiv="Content-Type"
              content="text/html; charset=shift_jis">
        <title>サンプル 02</title>
        <script language="javascript">
    var opacity = 50;
    
    function document_load() {
        fore.style.filter = "Alpha(Opacity=" + opacity + ")";
        label.innerHTML = "Opacity=" + opacity;
    }
    function dec_click() {
        if (opacity > 0) opacity -= 10;
        fore.style.filter = "Alpha(Opacity=" + opacity + ")";
        label.innerHTML = "Opacity=" + opacity;
    }
    function inc_click() {
        if (opacity < 100) opacity += 10;
        fore.style.filter = "Alpha(Opacity=" + opacity + ")";
        label.innerHTML = "Opacity=" + opacity;
    }
        </script>
        </head>
    
        <body onLoad="document_load()">
        <table width="100%" height="100%">
        <tr><td align="center">
            <input type="button" onClick="dec_click()"
                   value="より透明に">
            <input type="button" onClick="inc_click()"
                   value="より不透明に">
        </th></tr>
        <tr><td align="center"><p id="label">Opacity=100</td></tr>
        <tr><td align="center" style="
            background-image:url(back00.jpg);
            background-repeat:no-repeat;
            background-position:center;
        ">
            <img src="fore00.jpg" id="fore">
        </th></tr></table>
        </body>
    </html>
    
[/code]


CC BY-SA 3.0
2016-09-28T06:31:41.157
29206
2016-09-28T09:14:32.933
2016-09-28T09:14:32.933
18815
question
javascript
javascriptで透過処理が動作しない


[filterプロパティ](https://msdn.microsoft.com/en-
us/library/ms530752\(v=vs.85\).aspx)はInternet Explorer 4.0で導入されたものですが、Internet
Explorer 9から非推奨、Internet Explorer 10から削除されています。  
記述されているHTMLが想定している環境では正しく動作します。


CC BY-SA 3.0
2016-09-28T06:58:32.330
29207
2016-09-28T06:58:32.330
4236
29206
answer


[対応表](http://caniuse.com/#feat=css-filters)を見てもらえば分かると思いますが、  
確認するブラウザによっては動きません。  
2つくらい透明化するスタイルを追加しました。  
(IE10って普通に`opacity`効いたと思うので、後おまけで`moz-opacity`やっておく)

[code]

    var opacity = 50;
    
    function document_load() {
        //透明化（既存）
        fore.style.filter = "Alpha(Opacity=" + opacity + ")";
        //透明化（追加）
        fore.style.opacity = (opacity*0.01);
        fore.style.MozOpacity = (opacity*0.01);
        label.innerHTML = "Opacity=" + opacity;
    }
    function dec_click() {
        if (opacity > 0) opacity -= 10;
        document_load();
    }
    function inc_click() {
        if (opacity < 100) opacity += 10;
        document_load();
    }
[/code]

[code]

    <html>
        <head>
        <meta http-equiv="Content-Type"
              content="text/html; charset=shift_jis">
        <title>サンプル 02</title>
        </head>
    
        <body onLoad="document_load()">
        <table width="100%" height="100%">
        <tr><td align="center">
            <input type="button" onClick="dec_click()"
                   value="より透明に">
            <input type="button" onClick="inc_click()"
                   value="より不透明に">
        </th></tr>
        <tr><td align="center"><p id="label">Opacity=100</td></tr>
        <tr><td align="center" style="
            background-image:url(back00.jpg);
            background-repeat:no-repeat;
            background-position:center;
        ">
            <img src="https://dummyimage.com/64x64/000/fff" id="fore">
        </th></tr></table>
        </body>
    </html>
[/code]


CC BY-SA 3.0
2016-09-28T07:35:11.390
29209
2016-09-28T07:35:11.390
29206
answer