toyoshiの日記は終了しました。 ご愛読ありがとうございました。 Misocaへ戻る
スタートアップ経営者から見たQiita:Teamのいいところ | toyoshiの日記
toyoshiの日記は終了しました。 ご愛読ありがとうございました。 Misocaへ戻る
【MailForm01】PHPメールフォーム多機能版（著作権リンク無し）フリー（無料）｜PHP工房
【重要】※要修正 PHP8以上の場合にエラーとなり送信できない問題 ただし、2020/05/08以前にダウンロードされた方が対象です。 2020/05/08以降にダウンロードされた方は関係ありませんので無視して下さい。 対象かどうかの確認方法はファイル内上部に「ver2.0.0」など、バージョンが記述されている場合は改修済みですので対応不要ですが、記載がない場合（最終更新日2018/07/27などとなっている場合）は修正が必要です。 バージョン（ver●●）が表示されている場合の記述例 PHPメールプログラム フリー版 ver2.0.0 最終更新日2021/05/20 ※この場合は修正の必要はないということです。 【症状】 送信した際にPHP7.4の場合は環境によってエラーが表示される。PHP8以上の場合はエラー表示（またはページ真っ白）となり、送信が行えなくなります。 【原因】 PHPの
入力フォーム改善でCV率1.6倍！成果を上げる18のテクニック | LISKUL
たかが入力フォーム、されど、入力フォーム。 ユーザーが入力フォームに入力しているとき、もう気持ちは「購入します！」「申し込みます！」と決まっているはずです。 しかし、入力フォームが使いにくいために、せっかくの顧客をのがしてしまう可能性があるのです。 サイトへの流入はあるのに成果が上がらない・・・。 フォームPV数とコンバージョン数に差がある・・・。 そんな時には入力フォームを見直すべきかもしれません！ 入力フォームについて書かれている16の記事、サイトを参考に、結局、なにが重要なのか、基本と応用合わせて18のテクニックを厳選し、事例を交えてお伝えします。 入力フォーム改善の威力、条件を知ることで、成果を上げる入力フォームを作ることができるはずです。 失敗しない入力フォームを選ぶ！【LISKUL特集（2019年版）】CVR改善ツール一覧>> ※本記事は2014年7月29日に公開された記事をL
[JS]これ、いい！サイトのデザインを損なわずにフォームの進捗を美しく表示するスクリプト -Fort.js
デモページ：Sections デモでは他にもグラデーションを使ったGradient、進む時に光るFlashなどが用意されています。 デモページ：Default デモページ：Gradient デモページ：Sections デモページ：Flash Fort.jsの使い方 Step 1: 外部ファイル 当スクリプトとスタイルシートを外部ファイルとして記述します。 <head> ... <script src="fort.min.js"></script> <link rel="stylesheet" href="fort.min.css"> </head> Step 2: HTML バーを表示するdivをセットします。 <body> <div class="top"> <div class="colors"></div> </div> Step 3: JavaScript 適用するエフェクトを指
フォーカスで伸縮するクールな検索窓のデモ:phpspot開発日誌
Expandable Mobile Search Form フォーカスで伸縮するクールな検索窓のデモが公開されています。 場所を取らず、そこまで目立たせたくないような場合にコンパクトに収納できそうです。 非フォーカス状態 フォーカスすると以下のようになります。アニメーションが効いてて良い感じ もう一つのデモは、単なる虫眼鏡アイコン フォーカスで普通の検索窓に。 IE8移行とその他ブラウザなら動作するみたいでほぼ実用に使えます 関連エントリ 次世代の検索フォームを作成するjQuery＆CSS3サンプル リストを検索＆ソートできる7KBのJavaScriptライブラリ「List.js」 クールで高機能な次世代検索ボックスを作成できる「VisualSearch.js」
フォームの確認画面を自動生成するjQueryプラグイン autoConfirm.js | 14時の間食
確認画面作るのって面倒ですよね CakePHPでごく普通のメールフォームを作っていたら、 確認画面を作るのが煩わしくなったので、jQueryでそれっぽく見せるプラグインを作りました。 基本的にはformタグにクラス名を追加するだけ確認画面が生成できます。 動作デモや使い方、ダウンロードについては長くなるので別ページに置いておきます。 autoConfirm.js フォームの確認画面を自動生成 http://blog.material-being.com/portfolio/auto_confirm/ CakePHPのフォームヘルパーも使用できるので宜しかったらどうぞ。 余談 あとから知ったんですが、「フォームに確認画面を表示する」文化って日本特有らしいですね。 こういう分野の「日本特有」はあまりいい意味であることがないような…。(ﾟдﾟ)<やめてしまえ。 というわけで要らないといえば要らな
フラットデザインでレスポンシブな超カッコいいフォームを実装できる「Grid Forms」:phpspot開発日誌
Grid Forms Data entry made beautiful フラットデザインでレスポンシブな超カッコいいフォームを実装できる「Grid Forms」 フォームというと<input>で実装されたエレメントが多数出てくるのが当たり前なWEBですが、次のように、紙のフォームのようなフラットなデザインでグリッド状がクールなフォームが実装できます。 レスポンシブに綺麗にリサイズされます。 フラットなサイトではいい感じに活用できそうですね 関連エントリ スマホでのフォーム入力をシンプルに分かりやすくできる「Leader.js」 マークアップにValidateルールを定義してフォームバリデーションできるjQueryプラグイン「Ketchup」 画像をクリックで選択してフォーム送信できるようにするjQueryプラグイン「Image Picker」
20 Highly Creative Contact Form Designs for Inspiration
In this post, we’ve collected a bunch of creative contact forms for your inspiration that forms design above and beyond the norm. Out-of-the-box, a typical contact form is just a bunch of empty and dull boxes, with a generic submit button. Nothing special there, then. But with just the right amount of styling and design innovation, you can transform a form into something truly enticing and attenti
[JS]フォームのselect要素をHTMLの変更無しで、ミニマルに美しく使いやすくするスクリプト -Minimalect
フォームのselect要素をHTMLには手を加えずに、美しいミニマルなデザインを適用し、使いやすさもアップさせるjQueryのプラグインを紹介します。 デザインのテーマも用意されており、オリジナルのテーマをスタイルシートベースでつくることもできます。 Minimalect Minimalectの特徴 Minimalectのデモ Minimalectの使い方 Minimalectの特徴 select要素を洗練されたデザインに置き換えます。 optgroupsのサポート。 フィルタリングのサポート。 キーボードナビゲーション。 テーマのサポート。 Minimalectのデモ HTMLの変更は無しで、select要素を美しく、そして使いやすくしたデモがあります。 まずは、一つ目。
タッチデバイス対応、フォームのデザインをミニマルやフラットにしたり機能を強化するスクリプト -iCheck
フォームのラジオボタンとチェックボックスをミニマルやフラットやダークなど、今時のデザイン風に変更したり、コールバック関数や入力をコントロールできるjQueryのプラグインを紹介します。 iCheck iCheck -GitHub iCheckの特徴 iCheckのデモ iCheckの使い方 iCheckの特徴 1KBで超軽量 クロスブラウザ対応 IE7+, Firefox2+, Chrome, Safari3+, Opera9+ スマートフォン・タブレットなどのタッチデバイスをサポート iOS, Android, BlackBerry, Windows Phone キーボード操作をサポート タブ、スペース、矢印キー、他のショートカット HTML/CSSベースでカスタマイズが簡単 Retina対応のスタイルを6種類用意 チェックボックスとラジオボタンは15のオプションでカスタマイズ 8つのコ
チェックボックスとラジオボタンをスタイリングする為のjQueryプラグイン・iCheck.js
checkboxesとradioボタンをスタイリングするjQueryのプラグインです。カスタマイズ性に優れており、使い方も手軽そうだったので備忘録的にご紹介します。 よくあるプラグインですけど、使いやすそうだったのでメモ。 checkboxesとradioボタンをスタイリングするライブラリ。IE7にも対応しています。 かわいい。 スタイルは最初からいろいろと用意されていますのでカスタマイズの参考にもなりますね。 コード<script src="jquery.js"></script> <script src="jquery.icheck.js"></script>コアとプラグインを読み込みます。 $('input').icheck();初期化します。 $('input').icheck({ handle: '', // 'checkbox'か'radio'とすればどちらかに限定できる ch
[CSS]フォームの見栄えをぐっとよくする、テキスト入力欄とボタンをCSS3で美しくスタイルするチュートリアル
CSS3 Form Styling Cheat Sheet CSS3でスタイルするテキスト入力欄 CSS3でスタイルするフォームのボタン CSS3でスタイルするテキスト入力欄 HTMLは非常にシンプルです。 classのhogeは、随時変更して利用してください。 HTML <form> <input type="text" class="hoge" /> </form> まずは、ベースとなるスタイルシートです。 CSS: Basic border:0; padding:10px; font-size:1.3em; font-family:Arial, sans-serif; color:#aaa; border:solid 1px #ccc; margin:0 0 20px; width:300px; 枠線を角丸にします。
【jQuery】真・入力欄にフォーカスすると消えるヒントを表示する方法 | webシステム開発会社よりフリーランスのSEプログラマースコブト
まずは、こちら↓をご覧下さい。 名前を入力して下さい SE時代にWeb系の試験をしていて、「～を入力して下さい」ように「ヒント」として初期値を表示しておいてフォーカスが当てられると初期値を消去するフォーム部分にてバグが発覚したことがあります。 当時は「仕様です」という言葉でクローズされたのですが・・・。 今回は「仕様です」と言わずに済むスマートな実現方法を紹介します。 時間のない方は実現方法へ なにがいけないのか 実現方法を説明する前に、一般的な方法の問題点を説明します。 バグがある プログラムが冗長になる 任意の初期値が使えない 1. バグがある 次のテキストボックスに、初期値と異なる文字列を入力してみて下さい。 別の場所をクリックするなどしてフォーカスアウトすると、「入力済みです」という判定が表示されたと思います。 次に、初期値と同じ「ほげほげ」という文字列を入力した後、フォーカスアウ
フォーム（form）まわりで便利なjQueryスニペット6選
twitter facebook hatena google pocket Awesome jQuery snippets to work with forms | CatsWhoCode.comで紹介されていたスニペットがよさそうだったので、抜粋して紹介します。 sponsors 1："enter"キーを無効に $("#form").keypress(function(e) { if (e.which == 13) { return false; } }); 2：checkboxがcheckされているか確認 $('#checkBox').attr('checked'); 3：formの要素を有効／無効 $("#submit-button").attr("disabled", true); $("#submit-button").removeAttr("disabled"); 4：入力され
Inspiration - Web Design Ledger
Inspiration InspirationResourcesTrendsWeb DesignWordPress 10 Excellent WordPress Themes for 2024 Mark AdamsJanuary 4, 2024 InspirationResourcesTrendsWeb DesignWordPress Transform Your Website with These 10 Multipurpose WordPress Themes for 2023 Mark AdamsApril 27, 2023 Editors PickFeaturedInspirationResourcesWeb DesignWordPress 10+ Best WooCommerce Themes for 2023 Mark AdamsMarch 21, 2023 Inspirat
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
HTML5のフォーム要素のデフォルト表示を確認出来る・「Native form elements」
Feedback Me clean example
CSS3 Form Styling Cheat Sheet | Tiffbits
CodePen - Accesible form labels
spyrestudios.com| 502: Bad gateway
