1

YUIカレンダーウィジェットを正常に動作させることができました。ただし、表示されるときはページ上に「浮き」ません。つまり、コンテンツを形の外に押し出します。ページの上に浮かび、他の要素に影響を与えないようにする必要があります。

カレンダーを強制的にページ上に浮かせるプロパティはないようです。

ウィジェットが表示されたときにページの上に浮くようにする方法を知っている人はいますか。ウィジェットを表示するボタンはテーブルの中にあります。以下のHTML

<tr>
<td>Expiry Date</td>
<td><input name="ExpiryDate" value="" id="ExpiryDate">
         <img id="calico" src="resources/images/calendar_icon.gif" />
          <div id="calWidget"></div>
</td>
</tr>
4

1 に答える 1

1

なんとか解決策を見つけることができました。他のすべてが失敗した場合..HTMLとスタイルを追加するだけです。

まず、「calWidget」を別のdivでラップします（「calPanel」のIDを指定します）。このようになります。

<tr>
<td>Expiry Date</td>
<td><input name="ExpiryDate" value="" id="ExpiryDate">
         <img id="calico" src="resources/images/calendar_icon.gif" />
          <div id="calPanel">
             <div id="calWidget"></div>
          </div>
</td>
</tr>

次に、いくつかの単純なCSSを使用して、「相対的な」calPanelが「絶対的な」配置されたcalWidgetをラップします。「#calWidget」CSSの左/右/上/下を使用して、そこからカレンダーの配置をいじくり回すことができます。

#calPanel {
    position:relative;
}

#calWidget { 
    display:block; 
    position:absolute; 
    left:0px;
    z-index:99;
}

ポジショニングはIE7/8とFF3+で一貫しているようです...同じ問題がある場合にこれが役立つことを願っています...

于 2010-03-11T01:23:00.863 に答える