【HTML】Bootstrap4を使いレスポンシブサイトをコーディングする《導入編》
Twitterのデザイナーや開発者が作成した『Bootstrap』は、フロントエンドのフレームワークとオープンソースプロジェクトです。『Bootstrap』は、CSS、JS、およびフォントが基本セットになっています。HTMLのテンプレートソースを組み合わせて、レスポンシブ対応...続きを読む
『Bootstrap』は、フロントエンドのフレームワークとオープンソースプロジェクトです。『Bootstrap』は、CSS、JS、およびフォントが基本セットになっています。HTMLのテンプレートソースを組み合わせて、レスポンシブ対応のサイト制作が可能です。 『Boots...続きを読む
【JavaScript】ページ内リンクでページスクロールを実現する「smoothScroll.js」
「smoothScroll.js」は、ページ内リンクでページをスクロールを実装できすJavaScriptライブラリです。jQueryを実装していない状態でも稼働するので、手軽に導入できます。 基本的な使い方 導入は簡単、ライブラリを読み込むだけで実装でき、設置後は...続きを読む
【JavaScript】国産ライブラリtmlib.jsを使ったアニメーション入門
「tmlib.js」はゲームやブラウザツールを簡単に作る事ができる国産のJavaScriptライブラリです。「tmlib.js」を使うとアニメーションや画像表示、サウンドなどゲームなどに必要な処理がプログラミングしやすいようになります。 WEBサイトなどにもアニメーショ...続きを読む
Google Chart API でQRコードを自動生成する方法
Google Chart APIはGoogleが提供しているグラフなどのイメージを作成してくれるAPIサービスです。URLに必要な値を与えるだけで、グラフなどのイメージを返してくれます。 主にグラフなどを作成することができるのですが、その機能のなかにQRコードを作成して...続きを読む
【JavaScript】横にスライドするレスポンシブメニューを実装するライブラリ『mmenu』
スマートフォンやタブレットのアプリなどでボタンを押すとメニューが横から展開するインターフェイスをみることがあります。今回はそのような横にスライドするメニューを実装することができるJavaScriptライブラリ『mmenu』を紹介します。 『mmenu』 ダウン...続きを読む
【JavaScript】マウスオーバーでTooltips（吹き出し）を表示するライブラリまとめ
グラフィカルユーザインタフェース（GUI）において普及した表現手法のひとつにTooltips（ツールチップ）と呼ばれるものがあります。カーソルを合わせたときに吹き出しなどの小さな枠が表示され、補足の説明が表示される表現方法です。 今回は、Tooltips（吹き出し）を実...続きを読む
【JavaScript】グラフなどの描画をサポートするライブラリまとめ
折線グラフ、棒グラフ、円グラフやレーダーチャートなどを画像を使わずに描画をするJavaScriptライブラリをまとめてみました。 Chart ６種類のグラフを作成できるJavaScriptライブラリです。描画にはHTML5のcanvasを使用しています。 Dem...続きを読む
【JavaScript】フォームの入力チェックができるライブラリ『Validatr』
お問い合わせフォームなどの入力フォームで入力された値をチェックや未入力をチェックする事ができるJavaScriptライブラリ『Validatr』をご紹介します。 『Validatr』はjQueryをベースに開発され、MIT License にて公開さております。電子メー...続きを読む
【JavaScript】カルーセルパネルを手軽に実装できるライブラリ『Owl Carousel』
カルーセル(carousel)とは、回転木馬（メリーゴーランド）や空港の回転コンベアーなどの意味を持つ言葉です。 WEBデザインにおいて、カルーセルは複数の画像やコンテンツなどが配置されくるくる回るように動く仕組みを指します。 今回は、このカルーセルを手軽に実装で...続きを読む