JavaScript– tag –
-
Ajax(jQuery)とpushStateのみで実現するSPA用スクリプト
実際には「pjax（pushState + ajax）」というjQueryのプラグインを使っていますが、今回はjQueryとpushStateのみでSPA（シングルページアプリケーション）を実装します。以前紹介したCSSフレームワーク「Ratchet」は、まさに今回の応用です。 https://mino... -
背景でYouTube動画をループ再生するjQueryプラグイン「jquery.mb.YTPlayer」
最近、サイトの背景にYoutubeなどの動画を入れるのが流行っているようです。今回はjQueryのプラグインを利用してYouTubeの動画を背景に埋め込み、ループ再生する方法をご紹介します。背景に動画を埋め込む方法は、HTML5のvideoタグの出現が大きく影響して... -
【Ratchet】WEB上で簡単にiOSやAndroidライクなSPAが実現できるフレームワーク
SPA（シングルページアプリケーション）のフレームワークと聞くと、どうしてもReactやAngular等のJavaScriptのライブラリを想像すると思いますが、今回は学習コストがかかるような複雑なものでなく、iOSやAndroidのネイティブアプリのようなUIを実現するた... -
Chart.jsは簡単に美しくグラフを描画できるJavaScriptのチャートライブラリ
以前、D3.jsと言うJavaScriptライブラリを紹介しましたが、グラフの描画をするだけのライブラリではないので、グラフの描画をするだけにしては重く、学習コストもかかります。そこで、もっと簡単でグラフの描画だけに特化したJavaScriptライブラリ「Chart.... -
WordPress管理画面の 外観 ＞ カスタマイズ に設定項目を追加する方法
近年、WordPressのバージョンが上がってからは、テーマの質や管理画面の編集機能が向上したことで、ソースファイルを直接編集する機会が減ってきました。 特に「外観 ＞ カスタマイズ」では、画面を見ながらリアルタイムで編集した内容が反映されるのでと... -
あらゆるデータを可視化するJavaScriptライブラリ「D3.js」最強説
Adobe Flashが衰退していく中、WEB上での描画に関して最も優秀なJavaScriptライブラリとして今回紹介したいのが、「D3.js」です。タイトルに「データを可視化する」と書くと、データをグラフ化すると捉えがちですが、D3.jsの凄いところはグラフだけでなく... -
Pace.jsのプログレスバーがページのローディングを美しく魅せる
昔は、スマホもブラウザでWEBサイトのページを読み込むと、ローディング用のアイコンがグルグル回るだけでしたが、今ではプログレスバーが標準搭載されています。残念ながら、未だにパソコンのブラウザはタブのファビコン辺りがグルグル回るだけで、どのく... -
Offcanvasを付けたBootstrapのベーステンプレート作ったよ！
Offcanvas（オフキャンバス）とは、皆さんご存知のiOSやAndroidなどのスマートフォンでは当たり前のように使っているもので、画面の横（左右）からスルッと飛び出してくるメニューのことで、今回はBootstrapにこのOffcanvasを付けたベーステンプレートを作... -
究極のパララックスサイトを作るなら1度はparallax.jsを見るべし！
特殊なメガネをかけて見る3Dテレビや、裸眼で立体的に見えるゲーム、スマホが流行ってきた頃、WEBデザイナーやAppleは3Dなんて必要ないと言わんばかりに"視差効果"を使ったデザインが流行りだしたことを今でも覚えています。WEB2.0と言われていた時代には... -
WEB屋なら素材を毎月無料ダウンロードできる”Envato”のアカウントを作成するべき！
Envato（エンバト）は画像や動画だけでなく、HTMLテンプレートやWordPressのテーマ、ソースコードまで高品質な素材を格安で販売しているサイトです。 Envatoには有料の素材を毎月無料でダウンロードできるサービスがあり、アカウント作っておけば登録した...