INSTAHACK（インスタハック）は、テック系、Web制作系を中心とした記事を掲載するブログです。 ｜ INSTAHACKタグ analyticsapacheApplecssfontGamehtaccessiOSiPhonejavascriptLINELINE PayPhotoshopphpQRコード決済TheThorweb fontWordpressYouTubeアプリカメラユーティリティ格安SIM画像加工透明
[JS]最近リリースしたjQueryのプラグインのまとめ -2013年1・2月
紹介済みから未紹介のものまで、最近リリースしたjQueryのプラグインをまとめました。 去年までは33+1選としてましたが、今年から新たなフォーマットで。
jQuery を高速に使う CSS セレクタの書き方
jQuery は CSS セレクタで要素を選んで処理できるのが魅力的ですね。そんな jQuery ですが、CSS セレクタの書き方次第で速度が大幅に変わってきます。 ここでは jQuery の内部処理を疑似コードで示しつつ、jQuery を高速に使うためのポイントを５つに絞って紹介します。 何度も同じセレクタを実行しないクラスだけを指定するのは禁止#id を積極的に使う途中までの結果を再利用する子供セレクタ(>)を使うと速くなることがある ※ この記事は jQuery 1.2.6 のソースコードを元に記述しています 1. 何度も同じセレクタを実行しない 改善前 // 例題 1 $("div.foo").addClass("bar"); $("div.foo").css("background", "#ffffff"); $("div.foo").click(function(){alert
jQueryコーディングの基本的なことからプラグイン化までの注意書き（Webデザイン）
jQuery でのプログラミングの、基本的なことからプラグインを作るところまで、初心者の頃につまずいた部分を中心にまとめてみました。公式ドキュメントなどで使われている、少し難しい印象の専門用語も織り交ぜながら書きました。jQuery で Webデザインのパーツを作るときの注意書きという感じです。 Webサイトを作るとき、私的にはとってもよく使っている jQuery。jQuery を勉強しだしたころは、自分の書いたコードが動いたりするのが、とっても楽しくて嬉しかった覚えがあります。私はあまり JavaScript でのコーディングが得意ではないので、今でもよく jQuery を使ってコーディングしてます …。 以前：CSSは分かるけど jQuery は苦手 … という人が jQuery に親しんでくれるといいなーと思って書きました という記事を書いたのですが、今回はその復習 & jQuery
DD_belatedPNG / jQuery.belatedPNG についてメモ的な | プログラマ気分
一定期間更新がないため広告を表示しています
jQueryでモーダルウィンドウを作成。 | Almondlab
（追記／2011.12.02）ウィンドウをスクロールの際に、背景もズレてしまう不具合があったので、CSSとJavaScriptの一部を調整しました。 jQueryを使ってモーダルウィンドウを作成します。ウィンドウに表示するコンテンツはjQueryのAjaxで読み込むようにしています。 サンプルはこちら <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link
ブラウザベースのjQuery Mobileアプリ開発環境「codiqa」と「Application Craft」
jQuery MobileなどのすぐれたJavaScriptフレームワークの登場で、HTML5とJavaScriptを組み合わせたWeb標準によるモバイルアプリケーション開発が普及し始めています。 この記事では、Web標準によるアプリケーション開発をさらに簡単にしてくれる、WebブラウザベースのjQuery Mobile対応モバイルアプリケーション開発環境「codiqa」と「Application Craft」の2つを紹介しましょう。 Codiqa～jQuery Mobileアプリのモックアップがすぐ作れる モバイルデバイス対応のアプリケーションを開発するときに手間がかかるのが、小さい画面でも使いやすいユーザーインターフェイスの構築です。モックアップを作り、使い勝手を試す必要があります。 先月公開が始まった「codiqa」は、そのモックアップを手軽に、Webブラウザ上でドラッグ＆ドロップす
［速報］jQuery Mobile 1.0正式版が公開！ モバイルアプリケーション開発の新時代へ
モバイルアプリケーション開発のためのJavaScriptによるフレームワーク「jQuery Mobile 1.0」のFinal Releaseが、今週前半に予告された通り、ついに公開されました（日本時間18日午前3時頃）。 jQuery Mobileはオープンソースとして開発されており、「Download」ページからだれでも無料でダウンロード可能です。jQueryのWebサイトやマイクロソフトのCDN（コンテンツデリバリネットワーク）などでの配布もはじまっています。 HTML5のタグだけでモバイルアプリケーションが作れる jQuery Mobileの大きな特徴は次の3つです。 1）HTMLのタグだけで、プログラミングせずにモバイルアプリケーションができてしまう 2）モバイルのユーザーインターフェイス対応の部品が多く揃っている 3）iOS、Android、WebOS、Windows Mobl
高速化を果たしたjQuery Mobile RC3公開。問題がなければ今週中にこのまま正式版へ！
10月にリリース候補版のjQuery Mobile RC2が公開され、そこから数週間以内に正式版の登場が予告されていましたが、昨日あらためてリリース候補版のjQuery Mobile RCが公開されました。 RC2に比べてRC3ではパフォーマンスチューニングが行われ、高速化が実現しています。RC3リリースの目的は、高速化によるレグレッションや新たなバグなどが発生していないことを確認することです。 Sure, we know we said we were going straight to 1.0 when RC2 came out, but we’ve been making a ton of performance enhancements and we just want to make sure 1.0 goes off without a hitch. RC2が登場したとき、次は
[JS]設置も超簡単、あなたのウェブページのスクロールを慣性スクロールにするスクリプト -NiceScroll
live demo: IFrame iframeを使ったデモです。 div要素と同様にスクロールバーのカスタマイズ、コンテンツのズームが可能です。 NiceScrollの特徴 既存のコードの修正無しで、簡単に設置ができます。 ページのスペースを必要としないスクロールバーを設置できます。 スクロールバーのデザインを変更できます。 すべてのブラウザでマウス・キーボードでスクロールができます。 スクロールは慣性スクロールに対応しており、スピードは調整可能。 コンテンツのズーム機能。 対応ブラウザ IE6を含めたデスクトップブラウザだけでなく、iPhone, iPadなどモバイルブラウザ、タッチデバイスに対応しています。 Firefox 4+ Chrome 5+ Safari 4+ (win/mac) Opera 10+ IE 6+ iPhone, iPadなどのiOSデバイス [ad#ad-2]
スムーズにスクロールしないjQueryプラグイン「jDTScroll」 - Rewish
ページ内リンクでスクロールをスムースにするスクリプトは良くありますが、アレってもっとスムーズにスクロール出来ないのかなーとか思いますよね。僕は思います。 もっとスムーズにするのは僕には難しいので、普通のスムーススクロールがスムーズに感じられるように、スムーズにスクロールしないjQueryプラグインを作りました。 ダウンロードとデモ jdtscroll.js デモを見る 導入方法 1. jQueryとjDTScrollを読み込む <script src="jquery.js"></script> <script src="jdtscroll.js"></script> 2. 実行する $() で対象にする要素を指定します。ページ内リンクなのでフラグメント識別子が付いてるっぽいアンカーを指定するのがいいですね。 jQuery(function($) { $('a[href^="#"]').jd
これで自前でGoogleカレンダーを持てる！jQuery＆PHPで実現されたプログラム:phpspot開発日誌
これで自前でGoogleカレンダーを持てる！jQuery＆PHPで実現されたプログラム 2010年06月07日- Plugins | jQuery Plugins これで自前でGoogleカレンダーを持てる！jQuery＆PHPで実現されたプログラム。 なかなかリッチなUIとGoogleカレンダーばりの操作性を持つ便利なスクリプトになっています。 Googleカレンダーに登録するのもよいのですが、ちょっと外部に流したくないこととかも結構あるので、自前で構築したいというニーズもあるのではないでしょうか。 タイムライン上をドラッグ＆ドロップして予定を入れられます。ポップアップがでるので予定を入れます。日本語もOK 見ての通りUIもなかなかいい感じです。 スケジュール管理等に活用できますね。 関連エントリ GoogleカレンダーみたいなカレンダーをjQueryで一瞬で作成できる「jquery-w
PHP、Perl、Ruby、C、C++等40以上の言語をブラウザで実行できるようになるjQueryプラグイン「Run This」:phpspot開発日誌
PHP、Perl、Ruby、C、C++等40以上の言語をブラウザで実行できるようになるjQueryプラグイン「Run This」 2010年03月11日- Run This! PHP、Perl、Ruby、C、C++等40以上の言語をブラウザで実行できるようになるjQueryプラグイン「Run This」。 ブラウザ内の<pre>コードで記述した部分を、その場でそのまま動かすことができ、うまくサイトに組み込めばより訪問者にとってわかりやすいページを作ることが出来そうです。 例えば、PHPの入門サイトなんかでは挙動を一瞬で確認できてしまいます。 具体的には以下の言語に対応しています。 Ada, Assembler, AWK, Bash, bc, Brainf**k, C, C#, C++, CLIPS, Clojure, COBOL, Common Lisp, D, Erlang, Forth
jQueryでiCalライクなカレンダーを作るチュートリアル – creamu
jQueryでクールなカレンダーを作りたい。 そんなときにおすすめなのが、『Create astonishing iCal-like calendars with jQuery』。jQueryでiCalライクなカレンダーを作るチュートリアルだ。 このエントリーでは、↑のようなカレンダーの作り方が紹介されている。マウスオーバーするとふわっとポップアップするツールチップテキストつきだ。 ソースファイルもダウンロードできるので見てみてほしい。 デモは以下から。 View the online Demo! jQueryでiCalライクなカレンダーを作るチュートリアル、チェックして参考にしてみてはいかがだろうか。 Create astonishing iCal-like calendars with jQuery 天気がよくて気持ちいいですねー。 先日買った雑誌を読んでいます。「Casa」はまた紙面
jQueryを速攻マスターしたい方におすすめの「jQuery Selectors」:phpspot開発日誌
Selectors jQueryのセレクタ関数を速攻マスターしたい方におすすめの「jQuery Selectors」。 jQueryでの$('code') とかって、最初は何を意味するか分かりませんね。 jQuery selectorsを使えば、ボタンを押すことで、指定したエレメントがハイライト＆アニメーション表示されます。 要素がハイライト。 これは便利です。 関連エントリ jQuery 関連記事まとめ jQueryでリッチなグリッドを実装「jqGrid」 ファイルツリー構造を表示するためのJS「jQuery File Tree」 jQueryを使ってパズルを作るjQueryプラグイン
ニュータイプなJSライブラリjQueryを使ってみよう！
JavaScriptライブラリのニュータイプ「jQuery」。 jQuery is a new type of JavaScript library. jQuery: The Write Less, Do More, JavaScript Library ニュータイプと聞いては黙っていられないニュータイプファンの皆様こんにちは、公開APIを利用したサンプルサイトを作っていくよ管理人のZAPAです。 Web2.0やらAjaxやらの言葉が流行っていても、実際にそれっぽいものを作ろうと思ったところで、初心者は一体どこから手を付けて良いのかわからないのが現実だったりします。 そこで今回は、Web2.0っぽくAjaxを実現させることができるライブラリ「jQuery」の紹介をします。 Ajaxとは ここで言うAjaxは、オランダの名門フットボールチーム「アヤックス」ではなく、ウェブブラウザ内で非同期通
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Vertical space · Issue #141 · desandro/masonry
ASCII.jp：西畑一馬のjQuery Mobileデザイン入門
jQueryを使ったブラウザ上で動作するLeopardデスクトップの構築:phpspot開発日誌
selectボックスをシンプルなプルダウンに拡張するjQuery.selectable.js :: 5509