Facebook Likebox "allowTransparency"はW3Cバリデーターで無効なXHTMLを返します

Question

私は何をしましたか：私はそうでなければ "XHTML 1.0 Transitional"ウェブページにFacebook Like Boxを埋め込みました。 Facebookのようなボックスのソースコードは、Facebookから与えられているよう：

<iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fplatform&amp;width=292&amp;colorscheme=light&amp;show_faces=true&amp;stream=false&amp;header=true&amp;height=62" 
    scrolling="no" 
    frameborder="0" 
    style="border:none; overflow:hidden; width:292px; height:62px;" 
    allowTransparency="true"> 
</iframe> 

何W3Cバリ言う：私はW3CバリでのWebページをチェックすると、それは次与えるエラー：

Line 600, Column 421: there is no attribute "allowTransparency"

しかし、 IEにはallowTransparency="true">が必要です。

予想される解決策：自分のウェブページにFacebookのようなボックスを維持しながら、XHTML 1.0 Transitionalとして検証するにはどうすればよいですか。

Answer 1

2つのコードを書くことができます。 1つはallowTransparencyで、IEの場合はifステートメント、それ以外のステートメントは1つです。こうして、それを行うことができます。だから、条件付きHTMLのコメントで、この埋め込みコードを使用します。

<!--[if IE]> 
<iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fplatform&amp;width=292&amp;colorscheme=light&amp;show_faces=true&amp;stream=false&amp;header=true&amp;height=62" 
    scrolling="no" 
    frameborder="0" 
    style="border:none; overflow:hidden; width:292px; height:62px;" 
    allowTransparency="true"> 
</iframe> 

<![endif]--> 
<!--[if !IE]>--> 
<iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fplatform&amp;width=292&amp;colorscheme=light&amp;show_faces=true&amp;stream=false&amp;header=true&amp;height=62" 
    scrolling="no" 
    frameborder="0" 
    style="border:none; overflow:hidden; width:292px; height:62px;"> 
</iframe> 

<!--<![endif]--> 

のiframeコードがコメントアウトされていて、あまりにもallowTransparencyを使用することができますので、これはXHTMLを検証します。

EDIT：コメントでstaticbeastが指摘しているiframeを閉じました。

Answer 2

IE が本当に必要な場合は、allowTransparency="true"が有効です。有効なXHTML 1.0移行マークアップを作成することはできません。

... IEにはなぜその属性が必要ですか？それが省略されたらどうなりますか？

---

あなたが本当にW3Cの検証についてその気なら、あなたはJavaScriptを使用して同じiframe属性を適用することができ、（私はそれはそれだけの価値はないと思うが、それは私だけです）。 私は、これを推薦*をあなたはそれを行うことができていないよ：

*

document.getElementById('theIFrameID').allowTransparency = true; 

---

私は100％有効とマークアップを作成するための目標はJavaScriptを使用して正当化することはないと思うので、そうでなければ静的なマークアップと同一のものを達成する。

Answer 3

私は最近、それをテストしていませんでしたが、私はあなたがHTMLタグ内のコメントを持つことが許されていると思うので、ちょうどIEの条件付きコメントでallowTransparencyをラップ：

<!--[if ie]> allowTransparency="true" <![end if]--> 

IEはそれを見るようにするには、他のすべてがそれを無視します。これはまた、ブラウザによってコメントが無視され、条件付きコメントがIEだけで解析されるため、有効なXHTMLでなければなりません。

Answer 4

そのままにしてください。 "allowTransparency"はIEに何かを意味し、そうでなければ無視されます。検証は、文書自体を終了するのではなく、標準に対して文書をチェックするためのツールです。あなたは意図的に特定の事例のためにHTML標準の外に何かを書いています。それを隠そうとするよりむしろそれを認めてください。ボタンのようにFacebookのため

：私にとって

Answer 5

はこのようにjQueryを使用する最善の方法です。私は、クラス=「likebtn」を設定し、.jsファイル内：

$(document).ready(function() { 
    $(".likebtn").attr('allowTransparency', 'true'); 
}); 

ザッツすべての;-)

Answer 6

<iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fplatform&amp;width=292&amp;colorscheme=light&amp;show_es=true&amp;stream=false&amp;header=true&amp;height=62" 
    scrolling="no" 
    frameborder="0" 
    style="border:none; overflow:hidden; width:292px; height:62px; allowTransparency:true;"> 
</iframe> 

彼らは許可transparency.So以外のすべてを行うためにスタイルを使用し、なぜ私にはわかりません他のスタイルでそれを投げてください。それは検証する必要があります。