JavaScript Category Archive

JavaScript カテゴリの記事一覧。(1 / 5 ページ)

Web デザイナーさん向け Grunt を使った コーディング作業の効率化、はじめの一歩

GruntGrunt の導入記事なんか珍しくもないし、色々な方がわかりやすい記事を過去にも書かれていているので今さらではありますが......

とはいえ、まだ使ったことがない人もいるだろうということで、「Grunt って何ですか?」 とか「使ってみたいけどよくわからない......」 なんていう Web デザイナー (主に HTML や CSS を書くフロントエンドな人) さん向けに、初めて Grunt を使うならこれだけまずはやってみたら? っていう内容で書いてみようと思います。

なるべくコンパクトに書こうと思ったんですが、終わってみればかなり長い記事になってしまいました...... 覚悟してどうぞ。

Posted by:

Google タグマネージャで Web ページに読み込む JavaScript を管理してみる

Google タグマネージャGoogle タグマネージャ (Google Tag Manager) をこの Blog 内の各ページで読み込んでいる JavaScript コードの管理に数ヶ月前から使い始めていますが、結構使いやすくて便利なのと、ページの表示速度的にもいい結果が出たので紹介してみます。

Posted by:

Geolocation API 仕様が W3C 勧告に

W3Cすでに主要なブラウザでは実装済みなので、今さら感はありますが、Geolocation API が 10月 24日付けで W3C 勧告になりました。

Geolocation API の最初の草案 (Working Draft) が公開されたのが 2008年ですから、約 5年かけて勧告までたどり着きましたとさ。

Posted by:

Google が無料の Web コンテンツ作成ツール 「Google Web Designer」 を公開

Google Web DesignerGoogle さんが、HTML5 広告をはじめとした Web コンテンツをデザイン、作成するための無料ツール、「Google Web Designer」 を公開しました。

Photoshop などのような、視覚インターフェースを使用して、広告などの Web コンテンツを作成し、HTML5、CSS3、JavaScript を書き出すことが可能です。コードエディタも搭載されているので、出力されたコードを直接編集して、より高度なコーディングを行うこともできるようになっています。

基本的にはインタラクティブな要素を持った 「広告」 の作成を簡単に行うためのツールで、AdMob や DoubleClick といった広告プラットフォームとの連携機能も搭載されています。

Posted by:

CSS と jQuery で作るスクロールにあわせて回転するロゴ

TumblrTumblr のスタッフ Blog を見てたら、ロゴ (正確にはロゴの周囲の部分) がスクロールにあわせて回転してて、ちょっと面白かったのでサンプルを使って実際にどういう風に実装されているかを解説してみようと思います。

結構仕組みは簡単で、jQuery の scrollTop() を使ってスクロール位置を取得し、その値を CSS の transform プロパティに都度突っ込んでいくっていう感じ。ソースコード自体は数行で実装できます。

Posted by:

Blink で mouseenter/mouseleave イベントがサポートされるらしい

Google ChromeGoogle グループの blink-dev で、mouseenter / mouseleave イベントに関する話題が上がっていました。

簡単にいえば、Blink レンダリングエンジンで、mouseenter / mouseleave イベントをサポートするよという内容。WebKit Bugzilla の方でも 4月に mouseenter / mouseleave イベントのサポートに関する最終パッチが投稿されていて、最新のビルドでは実装済みです。

Posted by:

Firefox 23 が Content Security Policy 1.0 仕様に対応

FirefoxMozilla Hacks で、現在 Aurora チャンネルの、Firefox 23 が、Content Security Policy (CSP) 1.0 の仕様に対応した件、紹介されていました。

Content Security Policy (CSP) 1.0 は、あらかじめその Web ページで読み込まれることが想定されている JavaScript などのコンテンツを、ホワイトリストとして指定することによって、攻撃者によって挿入される悪意のあるスクリプトの読み込みを遮断し、クロスサイトスクリプティング (XSS) など、インジェクション攻撃から Web サイト や Web アプリケーションを保護するための仕組み。現在、W3C で策定が進められ、勧告候補の段階になっています。

Posted by:

jQuery 1.10.0 / 2.0.1 が同時リリース

jQuery先週ですが、 jQuery 1.10.0、および 2.0.1 が同時にリリースされました。jQuery 1.x 系と、2.x 系は、お互いに機能的には完全に互換性を保ちつつも、2.x 系は IE8 以前のサポートは捨てて、より高速に、安定して動作させることを目指したバージョンとして、一方の 1.x 系は IE8 以前をサポートするレガシーブラウザ向けのバージョンとなります。

この 2バージョンを並行して開発していく形は、jQuery 2.0 が正式リリースされた際に、今後はこういう形でいくよと予告されていたものですが、今回がその最初のリリースとなります。

Posted by:

Chrome Beta for Android 28 が Fullscreen API に対応

Chrome BetaChrome Beta for Android がバージョンアップして ver.28 (28.0.1500.21) になりましたが、Fullscreen API に対応したそうです。

Fullscreen API は Web ページ内の任意の要素をフルスクリーン表示可能にする仕組みで、現在 W3C でも標準化が進んでいます。この Blog でも、2年くらい前ですが Fullscreen API に関して書いていますので、その時に作ったデモページで実際に試してみました。

Posted by: