1

クリックするとファンシーボックスモーダルが開き、HTMLファイルをsrcとしてiframeを表示する名前のリストがあります。HTML ファイルには、人物の画像と短い略歴が含まれています。

画像を右に浮かせ、パディングを 10px にしたい。問題は、ファンシーボックスの動作方法またはHTMLファイルのエクスポート方法(inDesignを使用して他の人が作成したため、この奇妙なものすべてがあるため)のいずれかのために、cssまたはjQueryでアクセスできなかったことです-

    !--[if gte mso 10]>
    
     /* スタイル定義 */
     table.MsoNormalTable
        {mso-style-name:"表法線";
        mso-tstyle-rowband-size:0;
    ....
... 等々

私は手動で行って、画像のファイルスタイルのほとんどを変更しました -

img { float:right; パディング:右;}

これはほとんどのファイルで機能しましたが、imgタグに入ってスタイルを設定しても、いくつかのファイル(特にDon Hortonという名前の男)は何も起こりません-

`img src="/Horton_Don.html" style="float:right; padding:10px;"`

うまくいきません。

また、いくつかのjQuery関数を試しました。例を次に示します。

    $(document).ready(function()
        $('img').css("float", "right").css("padding", "10px");
    });

しかし、ファンシーボックス、またはおそらくiframeであるため、これは機能しないと感じています。

だから私の質問は:

A)jQueryを介してすべてのHTMLファイルのすべての画像を変更する簡単な方法はありますか(すべてのファイルを手動で入力するよりも、時間を大幅に節約できます)

B) img の変更を妨げている inDesign のがらくたと関係があるのでしょうか。

ここでは明確にしようとしていますが、わかりにくい場合は、明確にするためにいくつかの大きなコード セグメントをアップロードできます。

4

2 に答える 2

0

これは半分推測で半分ハックですが、A の場合、ページで $.get() を使用して、それを変数に割り当てることができます。次に、その変数を編集のコンテキストとして使用できます。

var page = $.get('page.html');
$('img', page).css('float', 'right').css('padding', '10px');

すべての jQuery セレクションは、セレクターが動作する HTML を指定するオプションの「コンテキスト」パラメーターを取ります。もちろん、変更を表示するには、iframe がページ変数を指す必要があります。

これは暗闇でのショットのようなものです。お役に立てば幸いです。

于 2012-09-06T17:43:57.030 に答える
0

これらのスタイルへの参照を保持する CSS ファイルをサーバー上に作成するだけです。

CSS ファイル

この例では、このファイルを myStyles.css と呼びます

img{
    float:right;
    padding:10px;
}

fancybox には onComplete api コールバック関数があるようです。

$('ele').fancybox({
    'onComplete' : function(){

        var cssItem = document.createElement("link") 
        cssLink.href = "myStyles.css"; 
        cssLink .rel = "stylesheet"; 
        cssLink .type = "text/css"; 
        frames['myIframe'].document.body.appendChild(cssLink);
    }
});

myIframe は iFrame の名前です。

于 2012-09-06T17:34:07.887 に答える