web-dev-qa-db-ja.com

Jqueryフルカレンダースクロールバーを削除

Jqueryの完全なカレンダーを使用していますが、スクロールバーを削除しようとしています。高さを設定してみましたが、動作しません。

誰かが修正を持っています(彼らが使用した!、リンクはありません-私はそれらのほとんどを試しました)?

私が使用しているもの:

$('#calendar').fullCalendar({
        firstDay: 1,
        minTime:@Model.MinHour,
       maxTime:@Model.MaxHour})

Screen Shot

ページは十分に大きいので、気の毒なことをすることはできません!

13
D-W

HeightとcontentHeightを同じ値に設定しましたが、うまくいったようです。

css:

#calendar {
   height:1000px;
}

js:

var calHeight = 1000;

$('#calendar').fullCalendar({
    height:calHeight,
    contentHeight:calHeight
});

編集:

ビュー間の更新で見つけたので、表示したくないときにスクロールが表示されました。これを追加しました:

.fc-scroller {
   overflow-y: hidden !important;
}
10
Adam Maloney

バージョン2.1.0以降、高さオプションは「自動」に設定できます。

https://fullcalendar.io/docs/display/height/

これにより、垂直スクロールバーが削除されます

6
J.T. Houtenbos

これを試してください https://fullcalendar.io/docs/contentHeight contentHeight: "auto"、スクロールバーの削除に使用されます

<script>

        jQuery('#calendar').fullCalendar({
         header: {
            left: 'prev',
            center: 'title',
            right: 'next'
        },
        defaultView: 'month',
        showNonCurrentDates:false,
        fixedWeekCount:false,
        contentHeight:"auto",
        handleWindowResize:true,
        themeSystem:'bootstrap3',

    });
</script>
5
Naveen dev

カレンダーを含むdivを作成し、css overflow-y:hidden;overflow-y:hidden;に入れます

div class="container-calendar"

.container-calendar {

overflow-x:hidden;
overflow-y:hidden;

}
2
Koala7

ドキュメントには、 height および contentHeight に指定されたautoオプションが機能すると記載されていますが、2.1.0より上のバージョンでのみ機能します。

このコードは、どのバージョンでも機能しました。

.fc-scroller {
  height: auto !important;
}
2
vinay mittal
$('.fullCalendar').fullCalendar({
                aspectRatio: 1.605,  -> this works for me
1
Harshana Lasith

Fullcalendarバージョン2.7.1では、オーバーフローを設定する関数の呼び出しで行にコメントを付けるのを修正できます。

this.applyOverflow();

この関数を呼び出す関数は2つあります。clear(8855行目あたり)とrender(8843行目あたり)です。

1
Maria

バグを解決した新しいバージョンを使用することになりました

0
D-W

height: 'auto'を使用して巻物を削除できます

$('#calendar').fullCalendar({
    height:'auto',
    ...
 });
0

これを試して:

$(document).ready(function () {
    $('#calendar').fullCalendar({
        height: 300,
        contentHeight: 360,
    });
});

これらの300と360は一例です。アイデアは同じままで、好きなように設定できます。

0
K-Alex

カレンダーの幅を拡張してスクロールバーをビューポートの右側から外し、含まれている要素に対してoverflow-x:hiddenを設定してみてください。

0
Edmond Chui