[HTML] シンプルで幅広いカスタマイズができるフォーム
web ページを制作する際 form まわりは時間のかかる作業のひとつです。form 部品の表示はブラウザごとや機種ごとでかなりバラつきがあるため、なかなかうまくいきません。 できるだけシンプルに、幅広いカスタマイズができるようなパターンを考えてみたいと思います。 ※HTML5 対応ブ ...
東京ホームページ制作
Copyright (c) BRISK All Rights Reserved.
[HTML] シンプルで幅広いカスタマイズができるフォーム
web ページを制作する際 form まわりは時間のかかる作業のひとつです。form 部品の表示はブラウザごとや機種ごとでかなりバラつきがあるため、なかなかうまくいきません。 できるだけシンプルに、幅広いカスタマイズができるようなパターンを考えてみたいと思います。 ※HTML5 対応ブ ...
webページ作成で CSSアニメーションを具体的に使えないか試す
CSS の animation や transition を使えるようになって久しいですが、実際の使いどころはいまいちな印象です。原因の大部分は IE にあるとおもいますけど。 そこで animation に対応しているまともなブラウザさんにはおもてなしを、 そして対応していない困ったブラウ ...
江東区にあるWeb制作会社BRISKの社長日記 2014年4月
3年目に突入したBRISKですが、先日新規一転ホームページをリニューアル致しました。 設立時にホームページを作成し、そこからWordPressを入れたり、レスポンシブ対応したりと マイナーチェンジをしていましたが、ようやくリニューアルできました。 案件の合間にちょこちょこ進め、できてない機能もあ ...
Google Mapにマーカー(ピン)やアイコンを表示して、クリックでコメントを出す
ホームページに地図を設定したい時ありますよね。 よく使われるのがGoogleマップを埋め込む方法です。 地図を表示させたい目的は、たいてい、ある特定の地点(例えば会社の場所)を指し示すためであり、 マーカーを置くのはほぼ必須となります。 そしてマーカーをクリックした時に何らかの動作をさせたい時も出 ...
[ jQuery ] select要素(プルダウン・セレクトボックス)を装飾する easyselectboxの使い方
デザインされたフォームを設置したいとき、select要素(プルダウン・セレクトボックス)の装飾はcssだけではなかなかうまくいきません。 背景や枠線をいじってみても、ボタンのところを装飾するのは普通の方法ではうまくいかないようです。 select要素の装飾用に作成されたjQueryのプラグインはい ...
[ jQuery ] フォームの入力チェックをする その2
フォームの入力チェックをするでフォームの入力チェックの拡張機能を作成しましたが、もうすこし使いやすくしました。 jQuery を読み込んだ後に読み込んでください。 20130826.js まず HTML 側にクラスを指定します。使用するクラス名は以下のとおりです。 error-b ...
[ jQuery ] フォームの入力チェックをする
フォームの入力チェックは地味に手間のかかるものですので、ちょっとした拡張機能のベースをを作成してみました。 jQuery 拡張 [crayon-664a758fd6304755089638/] 呼び出し [crayon-664a758fd6307 ...
モーダルウィンドウでリンク先を表示する
リンクをクリックした際、自ページ内でモーダルウィンドウとしてリンク先を表示する。という処理を考えてみます。 例)クリックして表示 BRISKトップページ Yahoo! amazon JavaScript [crayon-664a758fd63 ...
レスポンシブWebデザインについて
スマートフォンサイト制作において最近はいろいろな選択肢があります。 通常の制作以外にても、パッケージで安く作る、CMSを導入する等 要件、オーダーによっていろいろな手法があり その中の1つでレスポンシブWebデザインというものがあります。 レスポンシブWebデザインは、ブラウザの横幅に応じcssを ...
初めてのjQuery
jQuery(というより JavaScript)はブラウザで動くので簡単に書き始めることができます。既存のコードの改変や追加をしたり、script タグにサンプルのコピーを貼り付けたりしても結構うまくできてしまいます。 それも悪くないですが、ここでは jQuery の準備 ~ 基本的な使い方を ...