タグ

関連タグで絞り込む (0)

  • 関連タグはありません

タグの絞り込みを解除

jQueryとuiに関するstudio-hのブックマーク (6)

  • [JS]操作が気持ちいいさまざまなアニメーションでモーダルウインドウを表示させるスクリプト -animatedModal.js

    最近のUIの傾向として、ユーザーが操作して楽しくなるようなアニメーションは大切なポイントです。そんな気持ちいいCSS3のアニメーションでモーダルウインドウをページ全体に表示するjQueryのプラグインを紹介します。 横からアニメみたいにひゅっとスライドさせたり、ぼい～んとバウンドさせたり、気持ちよくて面白いものが簡単に実装できます。 animatedModal.js animatedModal.js -GitHub animatedModal.jsのデモ animatedModal.jsの使い方 animatedModal.jsのデモ デモでは、3種類のアニメーションを使ったモーダルウインドウを試せます。 アニメーションはanimate.cssを利用しているので、80種類以上のエフェクトが利用できます。 デモページ：Demo 3 In: bounceIn, Out: bounceOut a

    [JS]操作が気持ちいいさまざまなアニメーションでモーダルウインドウを表示させるスクリプト -animatedModal.js

  • ENTEREAL

    // 上記インプット要素に対し // 下のJSを実行するだけ <input type="text" class="form-control" id="Date"> // $('#Date').datepicker(); オプション設定 上記のサンプルはオプションを一切設定せず、デフォルトのままです。 デフォルトのオプション設定では、ほとんどが英語表記になっていますので、日本人ユーザのために日本語表記に変える部分を中心に記載します。 詳細は、(英語ですが)本家ページをご参照ください。　http://api.jqueryui.com/datepicker/ ここでの設定値 $('#Date').datepicker({ dateFormat: 'yy/mm/dd (DD)', yearSuffix: '年', showMonthAfterYear: true, monthNames: ['1月

    ENTEREAL

  • DatePickerDialogで日付の選択範囲を指定 - Qiita

    DatePickerDialogで日付の選択可能な範囲を指定する方法。 Webにもあまり情報がなかったので、メモ。 // 現在の日付を取得 Calendar calendar = Calendar.getInstance(); int year = calendar.get(Calendar.YEAR); int month = calendar.get(Calendar.MONTH); int day = calendar.get(Calendar.DAY_OF_MONTH); DatePickerDialog dlgDatePicker = new DatePickerDialog(this, year, month, day); // 最大値 // 月は0が1月となる。 GregorianCalendar maxDate = new GregorianCalendar(); maxD

    DatePickerDialogで日付の選択範囲を指定 - Qiita

  • Datepicker のカレンダーで選択できる日付の範囲を設定

    jQuery UI の Datepicker プラグインについての記事。Datepicker プラグインは、テキスト入力欄に、カレンダーから、日付を入力できるようにするプラグイン。選択できる日付の範囲を設定したい場合は、minDate オプションと、maxDate オプションを使う。 実装例（サンプル） 日付: 実装例（サンプル）の動作について 「日付:」の右側の、テキスト入力欄をクリックすると、今月のカレンダーが現れる。 カレンダーの日付をクリックすると、その日付を、テキスト入力欄に入力する。 をクリックすると、次月のカレンダーになる。 をクリックすると、前月のカレンダーになる。 本日の1週間前から、本日の1カ月10日後までの範囲を指定してある。範囲外の日付は選択できない。 実装例（サンプル）のソースコード 読み込み パスは、それぞれ、アップロードした場所を指定する。 まとめて読み込む場

  • Datepicker | jQuery UI 1.10 日本語リファレンス | js STUDIO

    jQuery UIのDatepickerはページに高機能なカレンダー型の日付選択のUIを追加します。 オプションによって、日付フォーマットや言語の選択、選択できる日付の範囲の制限、 ボタンやナビゲーションの追加などのカスタマイズをすることが出来ます。 デフォルト設定では、関連付けられたテキストフィールドにフォーカスされた場合に DatePickerはカレンダーを小さなオーバーレイで開きます。 インラインカレンダーについては、単純にdivまたはspanにDatePickerを指定してください。 DatePickerはいくつかの機能的なCSSを必要とします。 このCSSが読み込めないと機能しないため、最初に必要とするCSSを読み込むようにしてください。 キーボード操作のサポートについて カレンダーが開いている場合、下記のキーコマンドが利用可能なります。 PAGE UP 前の月に移動します。 P

  • jQuery UI - デートピッカー - jQuery 入門

    日付を入力する時には、カレンダーをみながら入力したい場合が多いものですよね。 最近のアプリケーションでは日付の入力項目では、キーボードからの入力を許可すると同時にカレンダーが表示される場合も少なくありません。 jQuery UI のデートピッカーウィジェットを使うと、簡単にカレンダーを利用できます。 基本的な利用方法 次のテキストボックスを日付の入力項目とします。 このテキストボックスに日付を入力するために、テキストボックスにフォーカスがきたときに、カレンダーを表示しています。 カレンダーから日付を選択すると、カレンダーが閉じて選択した値がテキストボックスに入ります。 ちなみに、このカレンダーは Ctrl + 矢印キーなどでキーボードからも操作可能です。 このようなカレンダーの表示をどのようにしたら実現できるでしょうか。実はこの動作はデフォルトの操作そのままなので、ほんの一行でできてしまい

  • 1

お知らせ

もっと読む

公式Twitter

  • @HatenaBookmark

    リリース、障害情報などのサービスのお知らせ

  • @hatebu

    最新の人気エントリーの配信

はてなブックマーク

公式Twitter

はてなのサービス

  • App Storeからダウンロード
  • Google Playで手に入れよう
Copyright © 2005-2024 Hatena. All Rights Reserved.