phiary
phi I'm a Game Programmer and Frontend Engineer passionate about programming education. Math / C / C++ / C# / JavaScript / HTML5 / CSS3 / Python 未だに form の validation って, とりあえずなんでも受け付けてサーバー側で してエラー返ってきたらヘッダーなりダイアログなりでエラーメッセージを表示するなんてのをよく見ます. 某大手サイトなんかはエラーがあるとリロードしちゃったりするし... ユーザーさんからすると入力した段階で何かしら間違いがあったらすぐに教えて欲しいですよね. 実はこの辺って HTML5 からクライアントサイドでもある程度チェックできるように整備されています. なのでライブラリを使わなくてもある程度サーバーに送る前に
フォーム周りで覚えておくと便利なCSS Snippets - NxWorld
フォーム周りでCSSを使ってスタイリングしていく際に、個人的によくど忘れしてしまうものや便利だと思うプロパティやスニペットをまとめました。 全体的に普段からCSSをよく触っている人にとっては特別目新しいものはないかと思いますが、まだCSSを触り始めて間もない方やこれからCSSを触ってみようという方は覚えておくと便利だと思うのもいくつかあるので参考にしてみてください。 紹介している内容はブラウザ（特にIE9以下）によっては使用できないものや表示確認ができないものもいくつか含まれています。 各要素のデフォルトスタイルを削除 フォームで使用するinputやtextareaなどの要素はブラウザやデバイスによって見た目は異なりますが、予めボーダー・グラデーション・角丸といったスタイルが適用されています。 特にこだわりがなければこのまま使用したり、多少手を加えるだけということもありますが、異なるブラウ
【保存版】問合せを劇的に増やすエントリーフォーム最適化（EFO）15の方法｜MarTechLab（マーテックラボ）
皆さんこんにちは。ギャプライズ鎌田（@kamatec）です。 今日は過去私が数百社という企業のプランニング・運用をしてきた中で実証した、 最も「手早く」「確実に」コンバージョンを伸ばす方法をご紹介します。 それがEFO、つまり「エントリーフォームの最適化」です。 Webサイトをリニューアルしなくとも、LPを作らなくとも、 エントリーフォームを変えるだけでコンバージョンは劇的に変わるのです。 実際の事例をいくつかご紹介しましょう。 Case1：ブライダル系サービスのEFO事例 http://www.primavera-wedding.co.jp Case2:ギャプライズクリックテールサイトのEFO事例 https://contentsquare.gaprise.jp/ Case3:システム系BtoBサービスのEFO事例 これらの事例はいずれも変更したのはエントリーフォームだけです。 特にフォ
jQueryの話 attrとpropの違い - もやもやエンジニア
多分、知っている人にはいまさら何言ってんのとお叱りを受けそうな話ですが、知らんかったので備忘録的にメモ。 仕事で作っているサイトはjQueryのバージョン1.3.2を使っているのですが、いい加減新しいの使おうよということで、こつこつ1.9系に書き直していっています。 （そんなことやってるうちに1.10系が出てしまいました。時代の流れは早いなあ・・・） で、入力補助的な機能をもくもく実装してたのですが、↓のコードがなぜか意図した通りに動かないのです。 $('#フォームの名前').on('click', 'ボタン名', function(e){ $('チェックボックスを指定するセレクタ').attr('checked', true); }); ボタンを押すと指定したチェックボックスに自動でチェックを入れるというコードですね。 今まではこれで動いていたのですが、1.9.1に入れ替えたらなぜか動か
チェックボックスやラジオボタンのデザインを簡単に変える方法(jQuery使用) | ousiadesign blog
こんにちは、秋永です。 超久しぶりにjQuery案件で重いものがあり、そこでちょっと悩んだことをアウトプットしようかなと思い、記事を書いてみました。 「そんなの常識だよ！」ということもあると思いますが、生暖かい目で見てあげてください。 ラジオボタン、チェックボックスのデザイン変更の仕方 これらは同じプラグインで行えます。 なかにはプルダウンメニューとかいろいろなものも変えられるプラグインもあるのですが、 今から紹介するもののほうが使い方が簡単です。 使うプラグインは「ScrewDefaultButtons」というものです。 使い方 まず、公式サイトにいき、ダウンロードボタンを押します 「github」というサイトに飛ばされるので、サイトの真ん中より上にある「zip」というボタンを押します。 するとダウンロードが始まるので、解凍してください 解凍したフォルダの中に入っているjsフォルダの
jQueryでチェックボックスのチェック状態を調べる方法 - 小さい頃はエラ呼吸
photo credit: Alan Cleaver via photopin cc 2013.06.14追記 コメント欄の指摘を受けて、記事を一部修正しました。 はじめに jQueryでチェックボックスのチェック状態を調べる方法をまとめてみました。 Web制作の現場で使うjQueryデザイン入門[改訂新版] (WEB PROFESSIONAL)posted with amazlet at 14.02.01西畑一馬 アスキー・メディアワークス 売り上げランキング: 6,298 Amazon.co.jpで詳細を見る jQueryのバージョン jQuery v1.10.1 jQueryでチェックボックスのチェック状態を調べる方法１ jQueryでチェックボックスのチェック状態を調べるには、以下のようなコードを書きます。#check1はチェックボックス要素のIDを指定します。$("#check1
jQueryでフォームの値を取得する方法をまとめておくので、コピペでご利用ください。 | Ginpen.com
必要ならどうぞ。 デモ jQueryでフォームの値を取得する方法をまとめ – jsdo.it – Share JavaScript, HTML5 and CSS jQueryでフォームの値を取得する方法をまとめ – jsdo.it – share JavaScript, HTML5 and CSS 共通：要素の探し方 input要素なんかにid振っちゃうのが一番なんだけど、属性セレクターを使うと楽な場合があります。つまり[name=xxx]で検索するやり方。 <form id="my-form"> <input type="text" name="my-text" value="This is text." /> </form>
[JavaScript]困った、Androidブラウザ上で起きた事あれこれ
仕様なのかバグなのか、書いたスクリプトが原因かもだけど。 Androidブラウザ上で起きたこまったことをいくつか… ＊標準ブラウザを使用しています。 予約語をキーにしたObjectがエラーになる（多分） Android 2.2 キーに”new”を設定したObjectを作ろうとしたらエラーになっちゃいます。 XMLから取ってきたデータをObjectにしようとしてたんですけど… tagにnewとあったので何も考えずにそのままキー名にしたのがまずかったみたいです。 2.3, 4.0はエラーにならないので2.2だけで発生する問題のようです。 原因は良くわからないけど”new”は予約語で、それを別の用途に使ってはいけない厳しい掟があるんじゃないかと勝手に納得しました。 キー名を変更し対処しました。 キーボードを切り換えるとblurイベントが発生する Android 2.2 input type:te
![[JavaScript]困った、Androidブラウザ上で起きた事あれこれ](https://cdn-ak-scissors.b.st-hatena.com/image/square/6c35180033ae4020a0e0c1b662cd0d153d918e3f/height=288;version=1;width=512/http%3A%2F%2Fwww.inazumatv.com%2F_fb%2Ffb_inazumatv2.png)
Custom Login Form Styling | Codrops
In this tutorial we will create some modern and creative login forms using some interesting CSS techniques and HTML5 goodness. Hi guys! I’m back with another CSS tutorial! After button switches and drop-down lists, let’s create some forms. In particular, we will be creating login forms. Nowadays, almost every web service, application, game etc. allows (or even requires) user subscription, which me
フォーム作成時のHTML制作とかサーバサイド側EFOとかフォームの挙動とかでのサービスとかのメモ｜Webディレクションやってます blog
Webディレクターとして名村晋治がプロジェクトマネージメントやディレクション業務に当たっている時に利用している問題解決の手法やツール、セミナー等で話をしている内容などWebディレクションに関する情報の紹介をしています。2005年より継続更新中。 先日ある案件で、フォーム周りの修正開発をしていたので、個人的に同様のフォームを次に作る時のメモとしてまとめたモノです。 久しぶりに真面目にブログのエントリーを書いた気がします。 フォームといえば「EFO(エントリーフォーム最適化)」が有名ですが、フロントエンド側でのEFOというよりは、HTMLを作る上での注意点とかサーバサイド側でのEFOだったりします。 フロント系は、EFOのASPとかも一杯あるので、まぁ・・・調べて下さい(笑) ってことで、すっごい長くなったので、目次から(笑) 目次 名前の「ふりがな」 メールアドレス 生年月日 郵便番号 住所
Select multiple form fields - finding a better solution for multiple selection
XHTML FORMS Select Multiple Form Fields Finding a better solution for multiple selection Most of the form fields available with HTML are straightforward and easy for people to understand and use. But there is one exception. The select multiple. While useful and necessary, the select multiple form field has always been a usability challenge. Example: Select some categories While it may be clear to
A-Form：MovableTypeにフォーム設置できるMTプラグイン｜Web制作のアークウェブ
MTでフォームといえば... 導入実績 1,000社以上 ドラッグ＆ドロップで項目を並べ、フォームをいくつでも。 受付数制限、期間制限、データのCSV取得など高機能です。 スマートフォンにも対応。
申し込みフォームを使いやすくして途中であきらめる人を減らす具体的な方法論【前編】 | カスタマーエクスペリエンスで道は開ける～フォレスター・リサーチのWebサイト方法論
[コラム]カスタマーエクスペリエンスで 道は開ける ～フォレスター・リサーチのWebサイト方法論 by ジョナサン・ブラウン フォレスター・リサーチのシニア・アナリストであるジョナサン・ブラウン氏によるウェブコラム。 主にカスタマーエクスペリエンスとマーケティングの側面から企業のビジネスをサポートしているジョナサン氏が、企業サイトにおけるユーザー志向の考え方や方法論をさまざまな切り口で解説します。 前回のコラムでは、ウェブサイトを使っているお客様がなぜ途中であきらめるのかというテーマで話しました。「ウェブサイトの欠陥」を大きくくくると、次の4つのどれかに当てはまります。 サイトのコンテンツ自体が足りない（価値の欠陥）価値のあるコンテンツが探しにくい（ナビゲーションが悪い）価値のあるコンテンツは見つかったがよくわからなかった（プレゼンテーションが悪い）サイトに信頼がなかったために使うのをやめ
チェックボックスを画像にするライブラリ
CRIR: Checkbox & Radio Input Replacement This combination of JavaScript and CSS will hide checkbox and radio inputs that have a class = "crirHiddenJS", an id, and a proper label tag. This will allow you to style the label however you wish using CSS, and the actual input control will be hidden. The form will still collect data as it normally would because the label itself will trigger the hidden in
Wufoo ? HTML Form Template & CSS Design Gallery
An arrow pointing left An arrow pointing right An arrow pointing left A magnifying glass The Twitter logo The Facebook logo The LinkedIn logo The Google Plus logo The RSS feed symbol The Wufoo by SurveyMonkey Logo The Wufoo by SurveyMonkey Logo A credit card A tray with an upwards pointing arrow A diamond with two arrows leading to different boxes Two bars in a chart Two pages A painter's palette
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【WordPress】続・お問い合わせ履歴も管理できてCSVも出力できるトレビア〜ンなフォームプラグイン Trust Form | バシャログ。