0

私は自分のブログ www.whataboutki.com で CSS スタイルの切り替えをいじっており、Google Friend Connect も追加しています。ユーザーがスタイルを変更したときに、GFC ウィジェットの色を変更したいと思います。これは GFC のスクリプトです... div id="div-1229769625913" は、css ファイルからアクセスできるということですか? もしそうなら、どうすればそうすることができますか？

<!-- Include the Google Friend Connect javascript library. -->
<script type="text/javascript" src="http://www.google.com/friendconnect/script/friendconnect.js"></script>

<!-- Define the div tag where the gadget will be inserted. -->
<div id="div-1229769625913" style="width:260px;border:1px solid #cccccc;"></div>
<!-- Render the gadget into a div. -->
<script type="text/javascript">
    var skin = {};
    skin['HEIGHT'] = '385';
    skin['BORDER_COLOR'] = '#cccccc';
    skin['ENDCAP_BG_COLOR'] = '#e0ecff';
    skin['ENDCAP_TEXT_COLOR'] = '#333333';
    skin['ENDCAP_LINK_COLOR'] = '#0000cc';
    skin['ALTERNATE_BG_COLOR'] = '#ffffff';
    skin['CONTENT_BG_COLOR'] = '#ffffff';
    skin['CONTENT_LINK_COLOR'] = '#0000cc';
    skin['CONTENT_TEXT_COLOR'] = '#333333';
    skin['CONTENT_SECONDARY_LINK_COLOR'] = '#7777cc';
    skin['CONTENT_SECONDARY_TEXT_COLOR'] = '#666666';
    skin['CONTENT_HEADLINE_COLOR'] = '#333333';
    google.friendconnect.container.setParentUrl('/' /* location of rpc_relay.html and canvas.html */);
    google.friendconnect.container.renderMembersGadget(
     { id: 'div-1229769625913',
       site: '10794935298529647173'},
      skin);
</script>
4

3 に答える 3

0

div-1229769625913最初にページ間の変更があるかどうかを実験します。そうでない場合は、CSS ファイルでスタイルを変更できます。それ以外の場合はskin、スタイル スイッチャー (JS だと思います) の色を変更する必要があります。

于 2009-01-04T12:51:31.053 に答える
0

div id はページ間で同じままですが、iframe が生成され、GFC ガジェットはその iframe 内に表示されます。CSS スタイルシートでは、その iframe のコンテンツのスタイルを制御できないため、これを実現する唯一の方法は、JavaScript を使用することです。

最も簡単な解決策は、そのハッシュ内のすべての値を取り除き、ガジェットをレンダリングする前に、現在使用されているスタイルシートに基づいて適切な値に置き換えることです。そうすれば、iframe の DOM をいじる必要がなくなります。これは、Google がこれを行うことを期待していないため、自明ではなく、信頼できないほど壊れやすいものです。

したがって、コードは次のようになります。

<!-- Include the Google Friend Connect javascript library. -->
<script type="text/javascript" src="http://www.google.com/friendconnect/script/friendconnect.js"></script>

<!-- Define the div tag where the gadget will be inserted. -->
<div id="div-1229769625913" style="width:260px"></div>
<!-- Render the gadget into a div. -->
<script type="text/javascript">
    function currentSkin() {
      // Put some real code that detects what the
      // right color scheme is here.
      return 'VERY_BLUE';
    }

    var skins = {};
    skins['VERY_BLUE'] = {};
    skins['VERY_RED'] = {};
    skins['VERY_BLUE']['HEIGHT'] = '385';
    skins['VERY_BLUE']['BORDER_COLOR'] = '#0000ff';
    skins['VERY_BLUE']['ENDCAP_BG_COLOR'] = '#0000ff';
    skins['VERY_BLUE']['ENDCAP_TEXT_COLOR'] = '#0000ff';
    skins['VERY_BLUE']['ENDCAP_LINK_COLOR'] = '#0000ff';
    skins['VERY_BLUE']['ALTERNATE_BG_COLOR'] = '#0000ff';
    skins['VERY_BLUE']['CONTENT_BG_COLOR'] = '#0000ff';
    skins['VERY_BLUE']['CONTENT_LINK_COLOR'] = '#0000ff';
    skins['VERY_BLUE']['CONTENT_TEXT_COLOR'] = '#0000ff';
    skins['VERY_BLUE']['CONTENT_SECONDARY_LINK_COLOR'] = '#0000ff';
    skins['VERY_BLUE']['CONTENT_SECONDARY_TEXT_COLOR'] = '#0000ff';
    skins['VERY_BLUE']['CONTENT_HEADLINE_COLOR'] = '#0000ff';
    skins['VERY_RED']['HEIGHT'] = '385';
    skins['VERY_RED']['BORDER_COLOR'] = '#ff0000';
    skins['VERY_RED']['ENDCAP_BG_COLOR'] = '#ff0000';
    skins['VERY_RED']['ENDCAP_TEXT_COLOR'] = '#ff0000';
    skins['VERY_RED']['ENDCAP_LINK_COLOR'] = '#ff0000';
    skins['VERY_RED']['ALTERNATE_BG_COLOR'] = '#ff0000';
    skins['VERY_RED']['CONTENT_BG_COLOR'] = '#ff0000';
    skins['VERY_RED']['CONTENT_LINK_COLOR'] = '#ff0000';
    skins['VERY_RED']['CONTENT_TEXT_COLOR'] = '#ff0000';
    skins['VERY_RED']['CONTENT_SECONDARY_LINK_COLOR'] = '#ff0000';
    skins['VERY_RED']['CONTENT_SECONDARY_TEXT_COLOR'] = '#ff0000';
    skins['VERY_RED']['CONTENT_HEADLINE_COLOR'] = '#ff0000';
    google.friendconnect.container.setParentUrl('/' /* location of rpc_relay.html and canvas.html */);
    google.friendconnect.container.renderMembersGadget(
     { id: 'div-1229769625913',
       site: '10794935298529647173'},
      skins[currentSkin()]);
</script>
于 2009-09-20T00:33:55.483 に答える
0

ID は GFC によって生成されます。*.gmodule.com サーバーでガジェット コードをホストする iFrame を DIV に入力します。

理論的には、スタイルを変更するために読み込まれた後に DOM にアクセスして変更することができます

スタイルの「スキン」マップの値を変更してみてください

例えば。skin['ALTERNATE_BG_COLOR'] = '#ffffff';

幸運を！

于 2009-01-21T02:39:01.717 に答える