no-image

JavaScript

スライダータイプの質問フォーム実装「jquery.formslider」

jquery.formsliderはスライダータイプによる質問フォームを実装できるプラグインです。質問に答えると次の質問がスライドしながら登場します。選択式で回答していけば、テンポよくフォーム完了までいくので、ユーザーへの負担も軽減できそうですね。

jquery.formslider

jquery.formslider

デモではページ読み込み時に「Are you a woman or man?」という質問が表示されていて、その下にWomen、Boy、Don’t knowの3つが選択できるようになっています。さらにその下にはフォーム完了までの進捗状況が分かるバーが設置されているので、あとどのくらいで質問が終わるのかを視覚的に把握できます。

質問への答えを選択すると、次の質問がスライドで登場します。対応する答えの選択リストもスライドとともに新たに表示されます。

デモでは答えの選択にイラストも付いているので直感的に分かりやすいのがいいですね。

また、レスポンシブやタッチジェスチャーにも対応しているので、パソコンからの閲覧だけではなくスマホやタブレットでも操作できます。

スライド式の質問フォームを実装したい人は、ぜひ「jquery.formslider」を活用されてみてはいかがでしょうか?

jquery.formslider

関連記事

  1. marginotes

    JavaScript

    テキストの余白に注釈をつけて読みやすい記事をつくれる「marginotes」

    marginotesは、クールなマージンノートを作成するjQueryプ…

  2. Linear Slider

    JavaScript

    シンプルな機能で使いやすいjQueryによる水平スライダー「Linear Slider」

    Linear Sliderはシンプルな機能性による水平スライダーを実装…

  3. jQuery cardslider

    JavaScript

    カードをスライドさせるようにコンテンツを表示できる「jQuery cardslider」

    jQuery cardsliderは、コンテンツをカードのように表示し…

  4. ToProgress

    JavaScript

    画面上部に軽量なプログレスバーを実装できる「ToProgress」

    ToProgressは画面上部にシンプルで軽量なプログレスバーを実装で…

  5. VenoBox

    JavaScript

    画像・Google マップ・YouTubeなどを埋め込めるLightbox風jQueryプラグイン「…

    VenoBoxは色んなコンテンツを埋め込めるLightbox風jQue…

最近の記事

  1. M360bt
  2. BQ-CASE/1
  3. GLOO BOX

アーカイブ

PAGE TOP