Webデザインの1pxを作るためのPhotoshopのレイヤースタイルいろいろ
色んな Webサイトを見ていると、1px にこだわって作られたキレイなデザインがたくさんあります。私は Photoshop を使っているので、Photoshop のレイヤースタイルを使って、1px の細かい所を作る Tips をまとめてみました。基本的な操作ばかりなので、これから Photoshop で Webデザインをやってみたいなーという人向けの記事です。 色んな素敵なデザインの Webサイトを観察していると、1px の細かいところまでこだわって作られてるデザインってとても多いですよね。1px … Webデザインでは一番小さいサイズ。「神は細部に宿る」という言葉もあるけれど、1px までしっかり作られたグラフィックはとても美しいですね！ 今回は Photoshop を使って、いろんな 1px を作ってみました。とは言っても難しいグラフィックデザインを作るわけではなくて、レイヤースタイル
jQueryでcheckboxがcheckされてるかの値をとる - Webtech Walker
checkboxがcheckされてるかどうかを判別するメソッドってjQuery側に用意されてないんですよね。 twitterでも色々教えてもらったけど方法としては3つくらいかなー。 https://twitter.com/kyo_ago/status/11685019866 https://twitter.com/songmu/status/11675950113 https://twitter.com/rea/status/11675545507 素のHTMLエレメントから取得 var checked = $('#elem').get(0).checked; せっかくjQuery使ってるのにという感じがいなめない。。これはないかな。 is()で取得 var checked = $('#elem').is(':checked'); これが一番直感的ではある。これでいいっちゃいい気もする。
フォームで離脱させないためのjQueryプラグイン50選｜designaholic -Creative Column-
最近では、エントリーフォーム最適化（EFO）という施策も広まってきましたが、特に購入やサンプル請求、お問合せ等がコンバージョンとなっているサイトではフォームで離脱されてしまってはせっかくの広告や施策が水の泡になってしまいます。 ここではユーザーを離脱させないために気をつけたいポイントとそれを実現するために便利なjQueryのプラグインを紹介します。 まず、入力フォームを作成する際のポイントは、ユーザーにストレスを感じせない事です。ストレスの原因となるものは大きく言うと 入力しづらい、エラーメッセージがわかりづらい、といった操作に関するもの。 どこまでやれば完了なのかわかない、個人情報の扱いが心配、といった心理的なもの。 です。なのでこの点を解消させてあげるフォームを作成すればユーザーが離脱する可能性は下がりますね。 具体的なポイントは以下のような項目になります。 必須入力か
CSS3とjQueryでフォームを美しく装飾する方法
2014年8月22日 CSS, jQuery どんなWebサイトでも設置されているフォーム。なんの装飾もなく味気ないフォームより、デザインされたもののほうが連絡してみたくなるはずです！そんなフォームも少し手を加えるだけで素敵なデザインに変身させることができます。今回はCSS3とjQueryを使ってより美しいフォームを作成する方法を紹介します。 ↑私が10年以上利用している会計ソフト！ フォームの仕様 今回チャレンジするフォームの主な仕様です！ グラデーション・ボックスシャドウを使って立体感を表現 角丸で丸みをつける（モダンブラウザ） 対応ブラウザ: IE7△, IE8△, IE9, Firefox, Chrome, Safari フォーム制作の流れ CSS3ってなんだ？という人もひとつひとつ記述していけば意外と簡単に作れるはずです！リンクをクリックで各項目にジャンプします。 テキストボック
GETとPOSTの使い分け - フォームデータの送信 -- ごく簡単なHTMLの説明
ブラウザからのデータデータは、特別な形式でエンコードされて送信されることになっています。画面に表示されるフォームのコントロールで入力する以外にも、隠されたデータの情報を送ったり、フォームを使わずに送信するなど、いくつかの方法があります。 目次： 作者の設定したデータを送る データ送信とURLエンコード フォームから直接メール送信 エンコードのタイプとファイル送信 GETメソッドとPOSTメソッド GETを使って直接データを送る 作者の設定したデータを送る input要素などで用意する「コントロール」はユーザーがそれを操作してデータを入力するためのものです。しかし、場合によってはHTMLの制作者が指定したデータをプログラムに送信したい場合もあるでしょう。このようなデータはユーザーが操作する必要はなく、ユーザーの目に触れないほうが都合がよいものです。そのために、input要素のタイプの一つとし
デザイナー・コーダー必見！使えるform関連jQueryプラグインの数々 | バシャログ。
こんばんは、最近ホルモン焼きにハマっているishidaです。 WEBサイト制作時、formは必ずといってもいいぐらい存在します。 お問い合わせフォームや会員登録フォームなどがすぐに思いつきますよね。 デザインをがっつりフォーム部分で作り込んでも、CSSのみでは、 実現できなかったりすることもよくあります。 そんなクセのあるformを、よりリッチに！かつ操作性を向上！できるjQueryプラグインの数々をご紹介します。 デザイナーの方は、フォームのデザインの参考に。 コーダーの方は、ページ作成時間の短縮に手助けになればと思います。 jQuery plugin: Validation フォームの入力チェック（バリデーション）が簡単にできるプラグイン。 エラーメッセージはlocalizationディレクトリ内に18言語用意されています。 日本語用は別途作成し、使用することが可能です。 jQuery
使いやすいフォームを実装するための10のポイント | コリス
ユーザーが混乱しない、使いやすいフォームを実装するために気をつけたい10のポイントをNoupeから紹介します。ブログのコメント欄を対象にしたものですが、フォーム全般にも言えることが多く含まれています。 Comment Form Styling: Examples and Best Practices下記に10のポイントとその概要を紹介します。 サイトではキャプチャなども豊富に掲載されています。入力フィールドはシンプルにたいていのフォームには複数の入力フィールドがあります。 フォームの目的はユーザーからの適切なフィードバックを得るのが目的なので、必要無いものや関係無い入力フィールドは削除します。ラベルは分かりやすく入力するユーザーの立場にたって、ラベル付けします。 例えば、「コメント」と単に記すだけでなく、「コメントを残してください」「あなたの意見をどうぞ」などです。また、「URL」などは用
JavaScript » GET送信によるパラメータの受け渡し | PHP & JavaScript Room
searchプロパティは、現在のURLの？以降の文字列を取得します。 オブジェクト名windowは省略可。 サンプルを見る<script type="text/javascript"> function getdata(){ if(window.location.search){ /* URLの「?」以降のパラメータを変数nに代入 */ var n=window.location.search.substring(1,window.location.search.length); /* テキストボックスにパラメータを表示 */ document.form3.elements["getpram"].value=n; } } /* オンロード時に実行 */ window.onload=getdata; </script> <form name="form3" act
WicketでダイナミックなWeb開発！(後編) [Javaプログラミング] All About
WicketでダイナミックなWeb開発！(後編)後編では、Wicketに用意されているコンポーネントを組み合わせてフォームをデザインしましょう。 フォームを使う 前回、Wicketを使ったWebアプリケーション開発の基本について簡単に説明をしました。今回は、さまざまなコンポーネントを実際に使ってみることにしましょう。まずは、フォームを使った送信の基本から作成してみましょう。 Wicketでは、フォームもコンポーネントとして用意されています。従って、Javaクラスではフォームのコンポーネントを作成し、そこに表示する部品類を組み込んでいきます。では、前回作成したPage1クラスを修正して、フォームを作成してみましょう。 package jp.allabout; import java.io.Serializable; import org.apache.wicket.markup.html.W
![WicketでダイナミックなWeb開発！(後編) [Javaプログラミング] All About](https://cdn-ak-scissors.b.st-hatena.com/image/square/8f530daf3cb408d6b6a0ba6f38ed7ccece36cffc/height=288;version=1;width=512/https%3A%2F%2Fimg.aacdn.jp%2Faa%2Fcommon%2Fogp300_300.png)
フォーム(form)のテキストエリア内の改行を<br />に変換するJavaScript(jQuery利用)
ちょっとしたテクニックなのかもしれないですが、 formのテキストエリアで改行つきの入力をしたときに、 改行を自動的にbrタグになる方法があったので、 メモとしてエントリーしておきます。 改行をbrにするスクリプト 改行をbrにするには正規表現を使う。 調べたところによると、ブラウザによって改行コードが違う可能性もあるので、 二つ指定しておくのがポイントのようだ。 改行は正規表現では「\r\n、\n、\r」らしいので、 これが含まれていたらbrタグに変換すればよい。 必要なスクリプトは下記の通りである。 尚、今回も指定しやすいようにjQueryを利用しています。 ■スクリプト $("textarea").change( function() { var txtVal = $(this).val(); txtVal = txtVal.replace(/\r\n/g, "<br />
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
日本のサイトで使用しているサーチボックスのサイズとボタンの一覧
http://www.designwalker.com/2010/06/jquery-forms.html