1

これをできるだけ明確にしようと思います!だからここに行きます!

私はAdamShawのjqueryプラグインであるfullCalendarを使用しています。作業中のプロジェクトに微調整を加えました。

目的:フルカレンダーのこの「バージョン」は、ウィンドウのドキュメントスペースを埋めるように設定されており、ウィンドウのサイズが変更されたときに常に表示されたままになるように設定されています(ウィンドウと右側のカレンダー自体の間に10pxのパディングを残します)および下部)。また、カレンダーナビゲーションののドキュメントの上部に10pxのパディングが必要です。左側はそのままです。

問題: zipに含まれている「localendar.html」をロードすると、いくつかの差し迫った問題が発生する場合があります(これは画面の解像度によって異なる場合があります)。現在、カレンダーはカレンダーナビゲーションの10px下に固定されていません。さらに、ブラウザウィンドウのサイズを変更すると、カレンダーは右側と下部に10pxのパディングを維持しますが、カレンダーの上部は、3つのカレンダー表示オプションすべてで希望どおりに機能しません。カレンダーにオーバーフローが発生してスクロールバーが表示されないようにする必要があります。

カレンダーは、すべての側面で10pxのパディングを維持する必要があります(左側と、カレンダーのナビゲーションの下の上部の10pxのみを除く)。カレンダーがネットブックの平均解像度より小さくならないようにするための最小の高さと幅(この時点でオーバーフローが発生してスクロールバーが発生することは許容されます)。

-これらの行は役立つかもしれません。

localendar.html(70-92、104-124)
fullcalendar.css(139-142 [view fullcalendar.css)
fullcalendar.js(473-492 [view fullcalendar.js)

4

1 に答える 1

1

要素のすべての位置属性を「絶対」に設定しています。何かを「position: absolute」に設定すると、「position: relative」に設定されている最も近い親内に絶対に配置されます。また、一般的なドキュメント フローから要素を削除します。上部の余白で何が起こっているかというと、カレンダーがドキュメント フローの外にあるため、その上のコントロールと重なっています。CSS から position 属性を削除する必要があります。

これは、html ページ自体のカレンダー スタイルに必要なものです。

    div#calendar {
    margin-left: 252px !important;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

style プロパティに div 要素を含めているのは、ルールに重みを与えるためです。fullcalendar.css ファイルで別のスタイルが重要に設定されているため、「margin-left」プロパティの値も重要に設定しています。これら 2 つを一緒に使用すると、そのファイルに適用された左マージンが上書きされます。

今のところサファリでしかテストできていませんが、ほとんどのブラウザで正しく動作するはずです。これが役立つかどうか教えてください。

于 2012-04-13T23:23:22.397 に答える