0

このテストページは、サイトでfancyboxを使用するために作成したもので、すべてのMacブラウザー、iOS、およびPC上の非IEブラウザーで問題ありません。Windows8の最新のIEも問題ありません。ただし、XPのIE8、7、および6は、ページに透明なオーバーレイまたはポップアップボックスの影を表示せず、ポップアップの下のページ上のリンクは引き続きクリック可能です（これは不要です）。（テストページのポップアップ画像は必ずしも正しい最終画像ではないことに注意してください-それは問題ありません）。

おそらく私はどこかでjsを台無しにしました（非常に基本的な構成を変更できることを除けば、私はjsの専門知識がまったくありません）。fancyboxのデモページは古いIEで正常に機能することに気付きました。

古いIEのボックスシャドウに煩わされることはありませんが、オーバーレイのモーダル動作が存在する必要があります。

私が間違っていた場所へのポインタは、ありがたいことに受け取られます。

4

1 に答える 1

1

これは、元のfancyboxファイルを変更するのが得策ではない典型的なケースです（何をしているのかを理解していない限り）。デフォルト設定を変更するには、独自のカスタムスクリプトを作成することをお勧めします。

「変更された」fancyboxjsファイルで、これを1707行目に追加しました。

css : {
  'background' : 'rgba(200,200,200,0.35)'  // changing here does change overlay colour
},    // custom CSS properties

この変更により、fancybox cssファイルの151行目に設定されているように、fancyboxのオーバーレイ画像がレンダリングされなくなります。

.fancybox-overlay {
    background: url("fancybox_overlay.png") repeat scroll 0 0 transparent;
    /* other properties here */
}

IE8以前のバージョンはサポートされていないRGBaため、オーバーレイは存在しません。ただし、この種の問題を回避するために、ここで提案されているようにフォールバック宣言を設定することをお勧めします。

次回は、独自のカスタムスクリプトを使用してデフォルト設定を上書きし、元のファイルをそのままにしてみてください。

編集：

独自のpngオーバーレイ画像の背景（独自の色と不透明度）を設定する場合は、カスタムスクリプトに追加するだけです。

helpers: {
    overlay: {
        css: {
            'background-image': 'url("path/my_own_overlay.png")'
        }
    }
}

元のfancybox_overlay.pngファイルはそのままにしておきます。

于 2013-03-26T18:13:29.460 に答える