3

Webサイト（テーマブラウザ）でjQueryUIサンプルを使用すると、見栄えがします。しかし、コードとテーマをアプリケーションに入れると、サイジングは大したことではありません（私はレドモンドのテーマを利用しようとしています）。

これらのサンプルがなぜそれほど異なって見えるのかについてのアイデアはありますか？私が作成したアプリケーションでは、レドモンドテーマ用のCSSリファレンスは1つだけです...以下のこれらの画像は、ブラウザにレンダリングされた方法とまったく同じです。

私のアプリケーション：
代替テキストhttp://www.imageunload.com/public/14462/jQueryUI.png

jQuery UIサンプル：
代替テキストhttp://www.imageunload.com/public/14463/jQueryUI-Sample.png

私のアプリケーションコード：

<div>
    <asp:TextBox ID="txtDateSample" runat="server"></asp:TextBox>
</div>
</form>
<script type="text/javascript" language="javascript">
    $(function() {
        $('#<%= txtDateSample.ClientID %>').datepicker({
            showButtonPanel: true,
            showOn: 'button',
            buttonImage: '../Graphics/Icons/calendar.png',
            buttonImageOnly: true
        });
    });
</script>

DivのFirebugビュー：

<div id="ui-datepicker-div" class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all ui-helper-hidden-accessible"/>
4

3 に答える 3

6

これは私に起こりました。これは、一部のスタイルが誤ってカレンダーdivに影響を与えているためです。Firebugを入手して、カレンダーに適用されているスタイルを確認してください。次に、テーマを編集して、スタイルが実行していることをすべてオーバーライドします。

編集：

探している部分は生成されたHTMLではありませんが、それは重要ですが、実際に適用されているスタイルの詳細です。

Firebugスタイルタブ
（出典：pathf.com）

適用されているスタイルが表示され、割り当てられているが適用されていないスタイルは削除されて表示されます。このウィンドウには、おそらくいくつかのスタイルが表示されます。彼らはおそらく犯人です。それらをより具体的にすることによってそれらを修正し、あなたのカレンダーはうまくいくはずです。

于 2009-03-18T01:41:52.147 に答える
1

物事が予想よりも小さい場合は、ある種のパーセンテージ/比例サイジングが再帰的に発生している、つまり、

.foo {width: 80%;}

どこかでそれが2回以上適用されているため、幅は80％の80％の80％になります。

于 2009-03-18T22:35:50.493 に答える
1

このコードを index.php ページ、ホームページ、またはすべてのページに追加します

<head>
<style>
    body{
        font-size: 62.5%; /* it is necessary for jquery ui */
        }
</style>
</head>

jquery-ui を使用する際にフォントやタグのサイズを管理することは、法的なコーディング手順です。

于 2013-06-12T07:54:49.313 に答える