web-dev-qa-db-ja.com

ドロップダウンメニューをInternet Explorerに埋め込まれたYouTube上に移動させるには、埋め込みショートコードのwmode属性をtransparentに設定します。

IE 8またはIE 9を使用してドロップダウンメニューにカーソルを合わせると、メニューdivがYouTubeの埋め込みの背後に表示されます。他のすべてのブラウザで問題なく動作します。

調査したところ、他の多くの人が 同じ問題 を持っていて、解決策はwmode属性をtransparentに設定することです。例えば<iframe width="578" height="325" src="http://www.youtube.com/embed/XXXX?wmode=transparent"></iframe>や<param name="wmode" value="transparent" />などです。

私の質問は、Wordpressの[embed]ショートコードを調整してwmode属性をtransparentに設定する方法です。

shortcodeembedvideosyoutubeoembed
3
Christine Cooper

oembed_resultを使用してoEmbedのHTML出力をフィルタリングできます。それではwww.youtube.comのURLのHTTPホストをテストし、パラメータを追加します。

OEmbed結果はpostメタフィールドにキャッシュされ、リクエストが多すぎるのを防ぎます。古い投稿を更新するために、YouTubeの埋め込み専用のキャッシュされたコンテンツを消去するアクティベーションヘルパーを追加しました。

<?php  # -*- coding: utf-8 -*-
/* Plugin Name: Add 'wmode' to video embeds */

register_activation_hook( __FILE__, 't5_clear_oembed_cache' );
add_filter( 'oembed_result', 't5_oembed_wmode', 10, 2 );

/**
 * Add "wmode=transparent" query string to youtube embeds.
 *
 * @wp-hook oembed_result
 * @param   string $html
 * @param   string $url
 * @return  string
 */
function t5_oembed_wmode( $html, $url )
{
    if ( 'www.youtube.com' !== parse_url( $url, PHP_URL_Host ) )
        return $html;

    return str_replace( '=oembed', '=oembed&amp;wmode=transparent', $html );
}

/**
 * Clear oEmbed cache for all youtube embeds.
 *
 * @return void
 */
function t5_clear_oembed_cache()
{
    global $wpdb;

    $posts = $wpdb->get_results(
        "SELECT post_id, meta_key
            FROM  `$wpdb->postmeta`
            WHERE  `meta_key` LIKE  '_oembed%'
                AND `meta_value` LIKE  '%youtube%'"
    );

    if ( ! $posts )
        return;

    /*
    return print '<pre>$posts = ' . htmlspecialchars( print_r( $posts, TRUE ), ENT_QUOTES, 'utf-8', FALSE ) . "</pre>\n";
    /*/
    foreach ( $posts as $post )
        delete_post_meta( $post->post_id, $post->meta_key );
    /**/
}

この属性を使用すると、スクリーンリーダーのユーザーはビデオ にアクセスできなくなり 、ユーザーはそれらを聞くことができなくなります。だからより良いオプションは代わりにYoutubeからのHTML5出力を使うことでしょう。

4
fuxia

Wmodeを透明にしたFlashムービーは、スクリーンリーダーを持った盲目のユーザーにはもう利用できないので、それはひどい考えです。その古い栗が再び現れる前に、盲目の人々はビデオを聴くのが好きです。 HTML5ビデオ埋め込みを使用して、YouTubeおよびYouTubeへのリンクを取得しているすべてのユーザーおよびIE8ユーザーに対して機能するようにします。古いIEは埋め込みがひどいので、あなたのアクセシビリティを損なわないでください。

2
user30934