0

だから私はこのホストされたjsを使って私のビデオを実行しています:http ://sublimevideo.net/

ここの最初のスライド:www.xsp.com/indexvideo.php

リンクは、コンテナを持つ非表示のdivを表示することになっています。ビデオをクリックすると、ヘッダーとフッターの間のスペースが埋められるはずです。それは何をしますか。また、ブラウザウィンドウのサイズを変更すると、ビデオのサイズも変更されることになっています。IE 7 + 8、Firefox、Safariで動作します。しかし、IE9ではありません。

誰か考えがありますか?

次のようにコードのサイズを変更します。

    $(window).resize(function() {
        proportion_index();
        clearTimeout(resizeTimer);
        resizeTimer = setTimeout(letsDoThis, 0);
    });

    function letsDoThis() {
        resize_object();
    };

    function resize_object() {
        var viewportwidth;
        var viewportheight;

        // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
        if (typeof window.innerWidth != 'undefined') {
            viewportwidth = window.innerWidth;
            viewportheight = window.innerHeight;
        }

        // IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
        else if (typeof document.documentElement != 'undefined' && typeof document.documentElement.clientWidth !='undefined' && document.documentElement.clientWidth != 0) {
            viewportwidth = document.documentElement.clientWidth;
            viewportheight = document.documentElement.clientHeight;
        }

        // older versions of IE
        else {
            viewportwidth = document.getElementsByTagName('body')[0].clientWidth;
            viewportheight = document.getElementsByTagName('body')[0].clientHeight;
        }

        //SET THE VIEWPORT TO BROWSER WIDTH AND BROWSER HEIGHT MINUS THE HEADER AND FOOTER SPACE
        if(viewportheight > 650) {
            viewportheight = viewportheight - 242;
        } else if(viewportheight <= 650) {
            viewportheight = viewportheight - 90;
        }

        $('#slide1video').css('width',viewportwidth);
        $('#slide1video').css('height',viewportheight);
        $('#slide1video').css('z-index','1001');
        $('#slide1video').css('background','#000000');

        $('#sublime_video_wrapper_0').css('width',viewportwidth);
        $('#sublime_video_wrapper_0').css('height',viewportheight);
        $('#sublime_video_wrapper_0').css('z-index','1002');
        $('#slide1video').css('background','#000000');

        $('span.sv_play_button').css('width',viewportwidth);
        $('span.sv_play_button').css('height',viewportheight);
        $('span.sv_play_button').css('background','blue');
        $('span.sv_play_button').css('z-index','1003');

        $('.sublime_video_content').css('width',viewportwidth);
        $('.sublime_video_content').css('height',viewportheight);
        $('.sublime_video_content').css('background','#000000');

        $('video.sublimed').attr('width',viewportwidth);
        $('video.sublimed').attr('height',viewportheight);
        $('video.sublimed').css('width',viewportwidth);
        $('video.sublimed').css('height',viewportheight);
        $('video.sublimed').css('max-width',viewportwidth);
        $('video.sublimed').css('max-height',viewportheight);
        $('video.sublimed').css('left','0');
        $('video.sv_html5_fullscreen').css('left','0');
        $('video.sublimed').css('z-index','1000');

        $('.sv_controls').css('width',viewportwidth);
        $('.sv_progress_back').css('width',viewportwidth - 89);
    }
4

1 に答える 1

2

手動で行うのではなく、SublimeVideo のサイズ変更メソッドを使用するようにしてください。ここでデモを見つけてください: http://test.sublimevideo.net/resizeおよびドキュメントのサイズ変更方法に関する詳細情報: http://docs.sublimevideo.net/javascript-api/methods#resize

ご不明な点がございましたら、コミュニティ フォーラムでお気軽にお問い合わせください。

于 2012-04-12T16:41:41.703 に答える