stylelintを使い始めたので設定例など (2016年9月更新) - yuw27b’s blog
※2016年9月13日更新：stylelintのアップデートに伴い、ルールの記述方法が古くなっていたものがありましたので、訂正しました。 stylelintって？ 名前のとおりCSSのlintツールです。 設定したルールから外れた書き方をすると警告してくれます。 CSSを書くにあたって、インデントにタブを使うのかスペースを使うのか、スペースなら何文字分にするのか、「{」の前にスペースを空けるかどうか、といった「書き方」を統一する目的で使います。バリデーション（CSSの標準仕様に準拠しているかどうかの判定）は行いません。 公式サイト：http://stylelint.io/ 日本語情報だとこちらが分かりやすかったです：CSSのLintをstylelintにする - Qiita stylelintの特徴 ルールのカスタマイズができる ルールセットの使い分けも簡単 CSSのlintツール自体は他
Show me the React! - Reactを使っているサイトが一目で分かる！ MOONGIFT
Reactでの開発を学ぶ上で、既存のReactを利用しているサイトを見てその内容を把握するのは良い材料になるでしょう。しかし表面上はDOMを出力しただけなのでReactを使っているのかどうかは分かりづらいです。 そこで使ってみたいのがShow me the React!です。Reactを使っているWebサイトがあればアドレスバーで通知してくれるようになります。 Show me the React!の使い方 Reactで作られているサイトを見ると、アドレスバーにReactのアイコンが出るようになります。 さらにクリックするとReactを使っているDOM部分がハイライト表示されます。 こんな感じでどの部分がReactで生成されているのかが視覚的に分かりやすくなります。 React開発時のヘルパーとして入れておくと便利ではないかと思います。今後、増えていくと思われるReactのシェアを知る上でも
:invalidや:valid擬似クラスを使ったフォームバリデーションエラーメッセージのスタイルサンプル
今更ながら擬似クラスを使ったフォームバリデーションのスタイリングを試してみましたのでメモがてら。目新しい情報でもないので適当にスルーして下さいませ。 自分用のメモです。CSS3からフォーム向けの便利な擬似クラスが追加されてるのですが試してなかったのでテスト。 フォームサンプル HTML5のフォームバリデーションサンプルです。A List Apartのデモを少し変えただけ参考に。 <div> <label for="email">メール</label> <input type="email" id="email" name="email" placeholder="example@example.com" required /> <p class="val"> <span class="invalid">正しいメールアドレス入れてくださいまし。</span> <span class="val
jQueryで要素の表示・非表示を判定する方法
jQueryの要素の表示・非表示を判定する方法を紹介します。 １．基本 jQueryでは、要素の表示・非表示のためのメソッドとして、show()とhide()が提供されています。 show()は指定した要素を表示します。 $('#foo').show(); hide()は指定した要素を非表示にします。 $('#foo').hide(); が、表示・非表示を判定する方法として、isShow()やisHide()、isVisible()などは提供されていません。 ２．css('display')で判定する show()はdisplayプロパティ「block」、hide()はdisplayプロパティを「none」にするので、これを判定に利用します。 if ($('#foo').css('display') == 'block') { // 表示されている場合の処理 } else { // 非表示
シンプル、軽量でカスタマイズしやすいフォームバリデーションjQueryプラグイン・validate.js
フォームバリデーション系のプラグインは 既に数多く良質なものが揃っているので、 今更、という気もしますが、自分と相性が 良さそうだったので備忘録。軽量でシンプル で、カスタマイズもしやすかったです。 高機能ではなくていいので、こういうのが 欲しいんですよね・・ もちろん、クロスブラウザで動作してくれます。圧縮すれば2KB以下にまで落とせる軽量ライブラリです。 バリデーション用のライブラリです。軽量でクロスブラウザ対応。コードもシンプルでカスタマイズしやすい印象でした。 サンプルです。エラーメッセージは適当なので気にしないで下さい。 Sample コード<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script> <script t
パスワード入力欄に必須！キーボードのCAPS LOCKがONかどうかを調べられるjQueryプラグイン:phpspot開発日誌
パスワード入力欄に必須！キーボードのCAPS LOCKがONかどうかを調べられるjQueryプラグイン 2011年07月05日- Caps Lock jQuery Plug-In キーボードのCAPS LOCKがONかどうかを調べられるjQueryプラグイン パスワードの入力の際なんかにCAPS LOCKがONになっていると正しいパスワードを入れたつもりがちゃんとはいってないなんていうことも結構ありますね。 そのような問題を解決するのがこのプラグインです。jQueryでその状態をチェックし、アラート等を表示することが出来ます 例えば次のように設定すれば、input type="password" の場合でCAPS LOCKがONの場合にalertをあげられます。 デモページはこちら 関連エントリ 独自デザインselectボックス実装時に使えそうなjQueryプラグイン「EasySelect
jQueryMobileでリアルタイムなフォームバリデーションを使う
jQueryMobileでのフォームバリデー ションに関して調べ物をしたのでメモ。 実装した事が無かったのですが、も しかしたら近いうちに使うかもなので 動作テストしてみました。バリデーシ ョンには他プラグインを使います。 結論から言えば非モバイルサイトのバリデーションの方法となんら変わりませんでした。一安心、みたいな記事なのでなんだかすみません。 コード<script src="http://code.jquery.com/jquery-1.5.2.min.js"></script> <script src="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.js"></script>当たり前ですけど、まずは本体とJQMを読み込む。 バリデーションはjQuery Validationです。日本語ローカライズはg
PHP/MySQL Contact Form with jQuery | Codrops
Here’s an implementation of a contact form with PHP and jQuery. Usually, one would only want the message posted by the user to be sent to an email address. This […] Here’s an implementation of a contact form with PHP and jQuery. Usually, one would only want the message posted by the user to be sent to an email address. This script does that and also saves all these messages in the database for the
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
