動画のリンク先がない場合に表示を消す方法
WordPress商品サイトのテンプレートのページに、カスタムフィールドからのリンク挿入で動画が表示できるエリアを作りました♪
動画のページへの埋め込み方法は、こちらのサイトがすごくわかりやすいです。
しかしWordPressのテンプレートなので、動画を設定していない商品ページまで、ビデオの表示がされてしまう。
しかも真っ黒のボックスのままで！
リンク先のない動画のボックス表示を見えなくする
生成されるHTMLではsrcの部分がリンク先が設定されていないページのソースはvido src=unknown となっていました。
CSSでimg[src=を使うことも試したのですが、img[src=”unknown”]{display:none;}では表示は消えませんでした。
調べた結果、有効だったのがこちらです。
onerrorイベントハンドラで表示させない
htmlのvideoタグに下記のコードを入れます。
onerror=”this.style.display=’none'”
私のソースではこのようになりました。
結果
見事に消すことができました。
皆さんもぜひお試しください。
ちなみに参考にしたサイトはこちらです。
'