そこそこユーザビリティの高いフォームを作った
そこそこユーザビリティの高いフォームを作った 入力内容の検証とか、郵便番号変換を備えた、そこそこ使いやすいフォームのテンプレートを作りました time2014/01/18 hatenabookmark- 去年末実家に帰省していた時に、jQueryの練習＆業務で使うために、フォームバリデーションとか郵便番号変換とかを備えた、そこそこユーザビリティの高い入力フォームをコーディングしていたので、ここで公開しておきます。 フォームサンプル ソースお持ち帰り用 (Github) ここで"そこそこ"と言っているのは、もともと業務でユーザビリティ改善案として使うことが目的であって、ベストを目指してもサーバ制約やコスト的な観点で使えないことがあるから、そこは目指さないよという意味です。そもそも、フォームは必要悪ですし、ベストはフォームが存在しないことですね。 フロントエンド実装だけです（サーバ側スクリプト
Sidr
SidrThe best jQuery plugin for creating side menus and the easiest way for doing your menu responsive You will be able to create multiple sidrs on both sides of your web to make responsives menus (or not, it works perfectly on desktop too). It uses CSS3 transitions (and fallbacks to $.animate with older browsers) and it supports multiple source types. Get startedLike any other plugin, you must inc
EasyUI - helps you build your web pages easily
Welcome to EasyUI EasyUI framework helps you build your web pages easily. GET STARTED What is EasyUI? easyui is a collection of user-interface components based on jQuery, Angular, Vue and React. easyui provides essential functionality for building modern, interactive, javascript applications. using easyui you don't need to write many javascript code, you usually define user-interface by writing so
9 Simple CSS & JS Snippets for Creating Beautiful Tabs
Tabs are a fundamental part of the web, and they’ve been around for years, but with even more developers going open source there’s a whole world of free code snippets out there. If you’re building a tabbed widget, you could always start from scratch, or you could rework someone else’s code and style the element to fit your project. That’s why I’ve created this collection of the best-tabbed widget
セレクトボックス内をマウスだけでスクロールできるjQueryプラグイン・ComboBox
なかなか素敵なユーザビリティ になるのでは。フォーム等で よくあるセレクトボックスを、 マウスのみでオートスクロール してくれるjQueryプラグイン。
あなたのWebを入力しやすくするjQueryプラグイン10選
あなたのWebを入力しやすくするjQueryプラグイン10選：CSSの書き方も分かるjQueryプラグイン実践活用法（終）（1/5 ページ） jQueryと、そのプラグインの使い方を、UI効果（エフェクト）のテーマごとに紹介する連載。jQuery/JavaScript/HTMLコードだけではなく、CSSの書き方も解説することで、より実践的にjQueryプラグインを使うための参考ドキュメントになることを目指しています。 前回の「画像や動画を綺麗に回転/拡大するjQueryプラグイン」では、イメージを回転させたりズームインする「jCarousel」「Zoombox」プラグインの使い方を解説しました。今回は、フォームを使いやすくするための各種プラグインを、以下のようにチェックボックス／ラジオボタン、ドロップダウンリスト、テキストボックス／テキストエリア、フォームのカテゴリ別に分類して紹介します。
iPhone向け最適化Webサイトを構築するjQueryライブラリ·jQuery iPhone UI MOONGIFT
jQuery iPhone UIはHTML/JavaScript製のオープンソース・ソフトウェア。iPhone用のWebサイトを構築するニーズが増えてきている。既に幾つかテンプレートもリリースされており、それらを使えば最適化されたインタフェースのサイトが作りやすくなる。 アイコンリスト そうしたライブラリを使う時に重要なのが、どれくらいの機能に対応しているかだ。単純なリストはもちろん、プロフィールページ、画像付きリスト、フォームなど多数のニーズがある。その一つ、JavaScriptを使ったパターンに適合できそうなのがjQuery iPhone UIだ。 jQuery iPhone UIの特徴は名前の通りjQueryを使っていることだろう。同種のライブラリとしてjQTouchがあるが、あちらはがちがちに固まっている雰囲気があるがjQuery iPhone UIは切り離して使えそうだ。HTML
jScrollPane
jScrollPane is a jquery plugin which allows you to replace the browsers default vertical scrollbars on any block level element with an overflow:auto style. You can easily control the apperance of the custom scrollbars using simple CSS. jScrollPane is crossbrowser, working on all browsers that support jquery and it also degrades gracefully. If a user's browser doesn't support jQuery or has J
"Outside the Box" Navigation with jQuery | Envato Tuts+
Just about every website uses the regular navigation concepts we're all used to. After awhile this can get pretty boring, especially for designers who thrive on creativity. While mimicking the OS X dock and stacks isn't new, it's certainly not common. A few days ago, Jeffrey posted about a potential "outside the box" competition on ThemeForest to encourage authors to put on their creativity hats a
ちょっとリッチなjQuery UI Sortaleのつくりかた - ginpeiのブログ
jQuery UI Sortableを使ってドラッグ＆ドロップで順序変更できるリストを簡単に作ることができるんですが、見た目がどうも好きじゃないです。なんというか、元いた位置がわからなくなっちゃうとことか。 そんなわけで、自分好みの見た目になるCSS（とJavaScript）を書いてみました。 とりあえずデモを見てみて下さいまし。IE6, IE8, Firefox3.5, Google Chrome 3, Safari 4 で動作確認しました。（IE7だけしてないです。） →LIVE DEMO ではコードを段階的に解説してゆきます。あ、コードは全てデモのHTMLファイル内に書いています。構造は上からCSS、HTML本文、JavaScriptになってます。 デフォルトの まずこれ。 /* 順序変更可能な一覧 */ .sortable-list { background-color: #EEE
jQuery Quicksand plugin
Activity Monitor 348 KB Address Book1904 KB Finder 1337 KB Front Row 401 KB Google Pokémon 12875 KB iCal 5273 KB iChat 5437 KB Interface Builder 87276499 KB iTuna 17612 KB Keychain Access 972 KB Network Utility 245 KB Sync 3788 KB TextEdit 1669 KB Demo seems sluggish? Disable CSS3 scaling and try again. Isn’t it cool? Now, choose your fighter:
Gears+jQueryでローカルからドラッグ&ドロップによる画像のアップロードを可能にするPlupload
デスクトップなどのローカル上から ブラウザに画像をドラッグ&ドロップし、 アップロードを可能にするPlupload をご紹介します。GoogleGearsと jQueryで実現しているようです。 実装にはGearsAPIが必要になります。 Drag files here.とあるところに、デスクトップから画像をドラッグ&ドロップすると画像を認識し、アップロードする事が可能です。 CMS向けに作成したとの事です。もちろんデスクトップ上に限らず、ローカル上のどこからでもアップロード可能。また、複数の画像をまとめてドラッグ&ドロップでアップロードする事も出来ます。これ、WPに入れられないかな・・・ GoogleGearsAPI Pluploadを使うにはGoogleGearsAPIが必要です。gears_init.jsはGoogleから無料でダウンロード可能ですよ。 Gears以外にMSのSilv
jQuery MultiSelect Plugin/Widget with ThemeRoller Support | Eric Hynds - Website Developer
I’ve been working on a multiple select plugin on and off for the past couple months and finally have it stable enough for a first release. When I started this project my intentions were only to re-factor Cory LaViska’s MultiSelect implementation, but it quickly turned into a complete re-write with a focus on speed and ThemeRoller support. This plugin turns an ordinary HTML select control into an
iPhone-like password fields using jQuery / DECAF Blog
or: Delayed password masking with JavaScript. ==This lib is deprecated. Sorry.== Jakob Nielsen recently asked us to Stop Password Masking: Usability suffers when users type in passwords and the only feedback they get is a row of bullets. Typically, masking passwords doesn’t even increase security, but it does cost you business due to login failures. useit.com/alertbox/passwords.html He suggests us
Manuel Boy - Director of Engineering - Phrase GmbH
Internet, Medienproduktion, Programmierung, E-Learning
Interface elements for jQuery - About Interface
Interface is a collection of rich interface components which utilizes the lightweight JavaScript library jQuery. With this components you can build rich client web applications and interfaces with the same simplicity as writing JavaScript with jQuery. The collection is dual licensed with the MIT license and the GPL, which basically means you can use it for free for both non-commercial and commerci
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
デザインから選ぶjQueryダイアログ集
http://www.designwalker.com/2010/06/jquery-forms.html
How to Build a Lava-Lamp Style Navigation Menu | Envato Tuts+
skyrocketlabs.com