jquery - ピースメーカーのフォールバック

Question

Piecemaker のフォールバック機能を含める方法があるかどうか疑問に思っていたので、モバイルで Web サイトを表示すると、ページは JavaScript ベースのスライダーを使用するようにフォールバックします。

どんな助けでも大歓迎です。

Answer 1

だから私は、crayon1の考え方に従い、フォールバックの子htmlを含めることができるように、フラッシュの埋め込み方法を変更することで、これを回避する方法を見つけたと思います。これには、2つのファイルを変更する必要があります。

JavaScriptFlashGateway.js＆

piecemaker-main.php（WordPressプラグインについて話していると仮定します）

JavaScriptFlashGateway.jsで、次のコードを見つけます。

function FlashTag(src, width, height)
{
    this.src       = src;
    this.width     = width;
    this.height    = height;
    this.version   = '9,0,0';
    this.id        = null;
    this.salign = "tl";
    this.scale = "noscale";
    this.allowScriptAccess = "always";
    this.allowfullscreen = "true";
    this.bgcolor   = 'ffffff';
    this.flashVars = null;
    this.wmode     = null;
}

そしてそれをこれに変更します：

function FlashTag(src, width, height, fallback)
{
    this.src       = src;
    this.width     = width;
    this.height    = height;
    this.fallback  = fallback;
    this.version   = '9,0,0';
    this.id        = null;
    this.salign = "tl";
    this.scale = "noscale";
    this.allowScriptAccess = "always";
    this.allowfullscreen = "true";
    this.bgcolor   = 'ffffff';
    this.flashVars = null;
    this.wmode     = null;
}

次に、さらに下の行を見つけます： "FlashTag.prototype.toString = function（）"

そして、その関数全体を次のように置き換えます。

FlashTag.prototype.toString = function()
{
    var ie = (navigator.appName.indexOf ("Microsoft") != -1) ? 1 : 0;
    var flashTag = new String();
    flashTag += '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" ';
    if (this.id != null)
    {
        flashTag += 'id="'+this.id+'" ';
    }
    flashTag += 'codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version='+this.version+'" ';
    flashTag += 'width="'+this.width+'" ';
    flashTag += 'height="'+this.height+'">';
    flashTag += '<param name="movie" value="'+this.src+'"/>';
    flashTag += '<param name="quality" value="high"/>';
    flashTag += '<param name="bgcolor" value="#'+this.bgcolor+'"/>';
    flashTag += '<param name="scale" value="noscale"/>';
    flashTag += '<param name="allowScriptAccess" value="always"/>';
    flashTag += '<param name="salign" value="tl"/>';
    flashTag += '<param name="allowfullscreen" value="true"/>';
    flashTag += '<param name="wmode" value="transparent"/>';
    if (this.flashVars != null)
    {
        flashTag += '<param name="flashvars" value="'+this.flashVars+'"/>';
    }
    if(!ie) {
        flashTag += '<object type="application/x-shockwave-flash" ';
        flashTag += 'data="'+this.src+'" ';
        flashTag += 'width="'+this.width+'" ';
        flashTag += 'height="'+this.height+'">';
        flashTag += '<param name="movie" value="'+this.src+'"/>';
        flashTag += '<param name="quality" value="high"/>';
        flashTag += '<param name="bgcolor" value="#'+this.bgcolor+'"/>';
        flashTag += '<param name="scale" value="noscale"/>';
        flashTag += '<param name="allowScriptAccess" value="always"/>';
        flashTag += '<param name="salign" value="tl"/>';
        flashTag += '<param name="allowfullscreen" value="true"/>';
        flashTag += '<param name="wmode" value="transparent"/>';
        if (this.flashVars != null)
        {
            flashTag += '<param name="flashvars" value="'+this.flashVars+'"/>';
        }
    }
    flashTag += this.fallback;
    if(!ie) {
        flashTag += '</object>';
    }
    flashTag += '</object>';
    return flashTag;
}

次に、piecemaker-main.phpで、次の行を見つけます。 "var tag = new FlashTag（'{$ this-> piecemakerSWF}'、{$ att ['width']} + 50、{$ att ['height']} +100、 '9,0,0'）; "

そして、「9,0,0」を必要なフォールバックhtmlに置き換えます。

これで準備完了です。お役に立てれば ：）

Answer 2

あなたはこれを理解することができましたか？私は、Piecemaker がデフォルトでこのオプションを持っているとは思わないし、Piecemaker の Flash 効果を 100% 模倣する Javascript でこれを行う方法を (まだ) 見たことがありません。

おそらくもっと良い方法があると思いますが、最初に頭に浮かぶのは、モバイル ブラウザー検出コードを使用することです (これらのコードはいくつか利用可能です。どのコーディング言語を使用するかはわかりませんが、Google で簡単に検索してみてください。さまざまなオプションを見つけることができます）。次に、デフォルトとして Piecemaker を使用してページのバージョンを表示するか、訪問者がモバイル ブラウザーを使用している場合は、選択した javascript/jQuery スライダーを使用してバージョンを表示できます。

EDITこれは、古いブラウザのフォールバックを備えた良い代替手段のようです：http://tympanus.net/Development/Slicebox/index4.html

それが役立つことを願っています!