かなりニッチだが、逆にそれがいいですな。 Creditcard.jsでは、クレジットカードを入力させるフォームを提供している。 興味深いのは、「今までのフォームのここがだめだ」と提唱している点だ。 たしかに読み進めていくと(細かい点ではあるが)普通のフォームだと改善の余地があることがわかる。 このライブラリを使うかどうかは別として、一度読んでおくと良いのではなかろうか。
jQuery と AngularJS は併用できるのか? jQuery と AngularJS は併用可能 jQuery メインのサイトで AngularJS を部分的に使用可能 AngularJS と jQuery は併用可能 AngularJS より先に jQuery を読み込ませていればその jQuery が利用される。jQuery を読み込ませていなければ AngularJS が内蔵している jqLite(jQuery の API 互換サブセット)の実装が利用される。 jqLite が実装している jQuery 互換の DOM 操作関連の API は、AngularJS: element で確認できるが、DOM 操作系の主要なメソッドは実装されている。 AngularJS 1.2 では、bind()/unbind()でなくon()/off()が利用されるため、jQuery のバージ
free body jewelry here . .♥ body jewellery for everyone from the Europierce body piercings specialists. . ♥ . . Welcome to the home of the safest and finest body jewellery ♥ Jewellery is the most precious gift on earth but it does not have to cost the earth ♦ Find here New Safe Jewellery that WE make and that you will not find anywhere else ♥ You dreamt it we made it ♥ Check our Special Offers..or
よくある入力フォーマットに沿っていない時のエラーによるイライラが軽減しそうです。 テキストボックスを使ってユーザに入力を行ってもらうのはシンプルですが、それが指定したフォーマットに沿っているかどうかを判断するのは大変です。その結果エラーになったりするとユーザにとっても大きなストレスになります。 そこで予め決まったフォーマットに沿ってしか入力できないようにしてしまうのが良さそうです。そのためのソフトウェアがformatter.jsです。 使い方はjQueryを使う、使わないの2パターンが用意されているようです。 // jQueryを使わない方法 new Formatter(document.getElementById('credit-input'), { 'pattern': '{{9999}}-{{9999}}-{{9999}}-{{9999}}' }); // jQueryを使う方法
もんたメソッド は(最近、突然TVでは見なくなった)某司会者がTV番組で行なっていた、一部を隠した文章を基にそれを徐々に見せながら行なうプレゼンテーションの方法です。さっきそれを知った私は、手軽にHTMLでもできたらな、ということで早速 jQuery プラグイン jquery-monta を書いてみました。 使い方は簡単です。まずは jQuery を読み込んでから、jquery-montaを読み込んで、隠したい 要素を jQuery で選択して monta() メソッドを呼ぶだけです! 実際の書き方はこんな感じ。 <div id="monta-sample"> これは<span>もんたメソッド</span>のサンプルです<br /> <span>隠したい要素</span>を jQuery でクエリーして <span>monta() メソッド</span>を呼ぶだけで<br /> 手軽に<s
これはインパクト大!が、多用は禁物なようです。 動きのあるWebサイトは目を引きます。Flashや画像を使ったアニメーションは多いですが、jQuery Lively LayoutはさらにWebサイト自体をアニメーションさせてしまうという凄いソフトウェアです。 何はともあれまずは動画を見てもらうのが良いと思います。 ということで凄さは分かってもらえたと思いますので使い方です。まずJavaScriptファイルを読み込みます。 <script type="text/javascript" src="/path/to/jquery.js"></script> <script type="text/javascript" src="/path/to/jquery.easing.js"></script> <script type="text/javascript" src="/path/to/jqu
Webページ作成時にリストやdivなど連続したブロック要素を並べた際に 中の要素量によって高さがまちまちになってしまった場合 個々の高さを揃えるのはCSSだけだと何かと面倒だったりします。 Webページ内に並べられたブロック要素の高さを揃えるjQueryプラグインは多々ありますが、 ここ最近新たに話題になった高さを揃えるプラグインもいくつかあったので 自分用メモとしてまとめて4つほど紹介してみます。 レスポンシブWebデザインに対応した「jquery.heightLine.js」 – to-R レスポンシブWebデザインに対応した「jquery.heightLine.js」 – to-R 言わずと知れた「to-R」さんの「jquery.heightLine.js」ですが 先日バージョンアップによってレスポンシブ対応され 今まで以上に便利なものになりました。 オプションでは ————————
WebページをRetina対応させるテクニック~基礎知識編:jQuery×HTML5×CSS3を真面目に勉強(4)(1/2 ページ) iPhoneのRetinaディスプレイは、Webページの制作フローにも大きな変化をもたらした。WebページをRetina対応させるにはどうすればいいのだろうか。 はじめに 2010年6月に登場したアップルのiPhone 4には「Retinaディスプレイ」と呼ばれる、それまでの常識を覆した高精細なディスプレイが搭載されました。それ以降、スマートフォンやタブレットといったモバイル端末のディスプレイはより解像度の高いものへと進化していき、2013年の初めにはサムスン電子のGALAXY S4やソニーモバイルのXperia Zなど、フルHD画質対応(1920×1080ピクセル)のディスプレイを搭載したスマートフォンが登場するまでになりました。 高精細ディスプレイの登場
jQuery Custombox :: dixso.net CSS3アニメーションがいい感じのモーダルダイアログ実装jQueryプラグイン「Custombox」 モーダルダイアログ自体のデザインは至って普通なんですが、出てくる際のエフェクトが豊富で一見の価値ありです エフェクト以外にも、イベントハンドラの設定やカスタマイズ項目が豊富で使いやすそうです 関連エントリ シンプル&軽量なモーダルダイアログ実装jQueryプラグイン「portBox」 フラットで美しいデザインのモーダルダイアログ実装ライブラリ「vex」 フラットだけど立体的なCSS3アニメーション付モーダルダイアログ実装デモ 何でも埋め込めてカッコいいモーダルダイアログ実装用jQueryプラグイン「Pop Easy」 フラットでカッコいいモーダルダイアログ実装デモ
そんな訳で、HTML5 の Canvas を駆使して一枚の画像ファイルから色情報を取得する方法を学んでみました。まだ学習の途中ではありますが、画像ファイルからカラーパレットを生成するところまでは出来るようになったので、当ブログで紹介するとします。 と、思ったのですが、このシリーズにしては結構難易度の高い内容なので、いきなりその方法を紹介する前に、ここでは基本的なピクセルの操作や色情報の扱いなど、前段階としての小規模なサンプルを紹介していきたいと思います。 Step.1 カラーピッカーを作る 見出しだけを読むとしょっぱなから大それた印象を受けますが、マウスカーソル位置にあるピクセル情報を取得・解析して、そこから色に関する情報を画面側に表示するといった単純なものです。 1 | HTML を組む とりあえず Bootstrap をベースにして適当に組んでみます。canvas 要素はピクセルでサイ
こんにちは。荒井です。 Facebookもtwitterもgoogleも画面遷移のときには、非同期で次のページを読み込むような作りになってますね! これは、ajaxで次のページを読み込むのと同時に「History API」というHTML5の機能を使って、URLを更新することで実現してます。 毎回全部読み直さないから通常の画面遷移よりも早いし、URLが変わるから履歴に残るし、良いことばっかり!!SEO的にも「#!」を使ったやつより良いよっていうのを何かで読みました!!! これからWebサービスを作るなら、導入したいですね!!! これpjaxを使えば簡単に導入できるんです!!!よし!!! PJAX!! pjaxとは、GithubのChris Wanstrathって人が作ってるjqueryプラグインです。 上で説明した、History APIとajaxを使った非同期の画面遷移を簡単に導入すること
fullPage.js ポートフォリオや企業のプロモーションでもよく見かける1ページで構成されたサイトで、フルスクリーンの垂直スクロール、そして水平のスライドにも対応したウェブサイトを作るためのスクリプト。 こういう作りは特にタブレットで操作がしやすいですね。 FancyScroll.js スマフォやタブレットのようにページの終わりまでスクロールした際にバウンドするのをはじめ、ちょっと面白いさまざまなエフェクトをスクロールに与えるスクリプト。
はじめに はじめまして。プログラマ向け情報共有サイトQiitaを開発・運営しているIncrements株式会社の高橋と申します。Qiitaではフロントエンドのアプリケーション開発にBackboneを採用しています。また縁があってBackbone.jsガイドブックという本を執筆させていただきました。本連載では、Backboneを使ったより実践的な話題を紹介していきたいと思います。 初回となる今回は「すでにjQueryを使っているけど最近何かと話題のBackboneも気になる!」という開発者の方がBackboneを試しに使ってみる際の初めの一歩の踏み出し方を紹介することが目的です。そのために今回はjQueryで実装されたサンプルコードをBackboneに移植します。 なぜBackboneを使うの? すでにjQueryがあるのになんでわざわざBackboneを使うのでしょう。jQueryを使えば
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
こんにちは、中川です。 ここ1・2年ですが、私の担当するプロジェクトでは、 PHPよりもJavaScriptの開発が多い状態が続いております。 JSのプロジェクトを重ねるにつれ、開発環境も段々と整理されてきましたので、 一旦、最近のJS開発で利用しているライブラリやツールなどをまとめてみました。 フレームワーク ●Backbone.js http://backbonejs.org/ JavaScriptのMVCフレームワーク。 何も使わない(もしくは我流)よりは、これを使って欲しいと思えるフレームワークです。 利用者が多く日本語情報も豊富にあるのと、フレームワーク自体が1500行程度と軽量なため、学習コストを低く抑えることができます。 ●AngularJS http://angularjs.org/ データバインディングを備えたフレームワーク。 高機能なテンプレートや、DIの仕組み、ルーテ
作成:2013/08/5 更新:2014/11/01 Web制作 > 食材を扱っているお客さんから、「ECサイト」を作ってくれと頼まれたので作成しました(事情により、CMSは使えず)。さらにメンテンスが楽になるように更新やSEOを自動化しました。今回は、CMS(WordPressとかEC-CUBEなど)を使わず仕組みを作るときに参考にした「プログラムサンプル」のまとめです。 プログラムの勉強にもなり、「へぇ~こんなことも出来るんだ」と思ったもの。今回は(PHP/jQuery/js)です。 エンジニア速報は Twitter の@commteで配信しています。 一般 画像/PHP 1.画像リサイズ 2.画像に字を書く 3.画像の拡大・縮小・サムネイル出力 4.グラフの描画 5.画像エフェクト25個 URL/PHP 6.ページのURLを取得 7.URLの中身(HTML)を取得 8.URL自動リン
Lightbox・モーダルウインドウ関連 / Bootbox.js / Bootstrap-modal他...全17件
ブラウザが表示するツールチップをテーマ毎のもの、またはカスタマイズしたものに置き換えます。 タイトルだけでなく、インライン脚注やAjaxを介して取得したコンテンツを表示します。 位置の調整をします。例えば、「要素の下の中央」といった指定が可能です。 拡張したスタイルを追加することで、警告やエラーといった表現をすることが可能です。 ツールチップの表示、非表示にはフェードアニメーションが使用されています。 このアニメーションはshowとhideオプションで変更することが可能です。 itemsとcontentsは同期されている必要があります。 片方を変更する場合は、もう片方も変更するようにしてください。 通常、無効になっている要素はDOMイベントをトリガしません。 したがって、無効な要素のツールチップのプロパティを制御することが出来ず、 ツールチップを表示/非表示する際には、イベントをリッスンし
TOP > WebDesign > 利用しやすいjQueryで作るツールチップを集めた「25 Useful jQuery Tooltip Plugins and Tutorials」 マウスオーバーしたときに出現するツールチップ、その対象物の内容を説明したり、補足的なデータを表示したりとユーザーインターフェイスを向上させてくれるテクニックの一つです。今日紹介するのは利用しやすいjQueryで作るツールチップを集めた「25 Useful jQuery Tooltip Plugins and Tutorials」です。 qTip – The jQuery Tooltip Plugin 吹き出しタイプやフェードタイプなど様々なもの集められていますが、今回はそのなかからいくつか気になったツールチップをピックアップして紹介したいと思います。 詳しくは以下 ■Prototip 2 – Crea
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く