VirtualBoxとVagrantで開発環境を構築
環境なんてMAMPとXAMPPがあれば全て解決する。 なんて思っていた。 そう今までは。 そううかつでした。 いやぁ時の流れは早いものですね。 今回はVirtualBoxとVagrantで環境構築ということで、まずそれぞれ「なんぞや」と言うところから。 まず、VirtualBoxなんですが、無料で使用できるx86仮想化ソフトウェア・パッケージの一つで、開発はオラクルが行っています。 その他にもVMの種類としてVMware FusionやParallels等があるのですが、これらは有償となっております。 なにはともあれダウンロードを行いましょう。 以下のURLからダウンロードできますので、お使いの環境に合わせてダウンロードしましょう。 ダウンロード https://www.virtualbox.org/wiki/Downloads ダウンロードしたら指示に従ってポチポチインストールしていきま
sassを簡単コンパイル GUIツール SCOUT
あ、ども。僕です。 ホント時代の流れの速さをひしひしと感じる今日この頃です。 前回の記事でsass導入について書かせて頂いたのですが、 CSSライブラリ化？ Sass(scss)のインストール 使用方法 mac こんな事しなくても、すぐに簡単sassをコンパイル出来るぜ！的なGUIツール「SCOUT」のご紹介です。 ターミナル等を扱わなくていいので、sass導入の敷居が下がったのでないのですか！？ いいですねー。 では、 インストール SCOUT http://mhs.github.com/scout-app/ こちらの公式ページから ADOBE AIRで作成されたアプリをインストールします。 赤く線で囲んだ部分をクリック！（当方の環境はmacな為、mac環境前提で話を進めさせて頂きます。winも変わらないと思います。） ダウンロード後 dmgファイルをダブルクリック。 Install S
CSSライブラリ化？ Sass(scss)のインストール 使用方法 mac
このサイトは、只今WEB業界で活躍中のデザイナー、プログラマーの方々の情報を集めたweb統合情報サイトです。 web帳 なんだか色々と出てきますよね。 もう、最近良く分かんないないです（笑） ではSassのインストール、使い方を紹介していこうと思っております。 Sass公式サイト http://sass-lang.com/ そもそも、Sassって何？って話なんですが、 SassとはCSS を生成するためのメタ言語です。 メンテナンス不能な状態に陥りがちのCSSをSass を使うことによって 上手い具合に構造化して記述することができます。 Sassという言語でcssを記述し、通常のcssとして吐き出すことが出来ます。 管理時は関数として扱い、使用する際に通常のcssと使用するイメージですかねぇ。 関数として扱ったり、 構造化して記述も可能。 1.Ruby Sassを利用するには、Rubyが必
スマートフォン JavaScript タッチ、フリックイベント実装
このサイトは、只今WEB業界で活躍中のデザイナー、プログラマーの方々の情報を集めたweb統合情報サイトです。 web帳 スマートフォンを操作する際、タッチや、フリック等、色々な操作方法があります。 タッチはご存知のとおり、スマートフォンのディスプレイにタッチすることです。 フリックとは、画面にタッチし指やペン等をスライドされる動作となります。 このタッチやフリックを操作する際、JavaScriptで取得出来、扱えるイベントは以下の通りとなっています。 touchstart touchmove touchend touchcancel gesturestart gesturechange gestureend これらのイベントを使い、操作していきましょう。 タッチされた場合のイベント まずは、タッチ出来るエリアの作成です。スマフォン用にviewportを設定します。 HTML <meta n
スマートフォン JavaScript タッチ、フリックイベント実装その2 「ボールを投げる」
の続きとなります。 今回は、フリックの判定、CSS3アニメーションでフリック判定によってボールを飛ばす。の2点をお届けします。 では、 タッチ、フリックイベント判定 なにを判定するかというと、右にフリックされたのか、左にフリックされたのかを判定したいと思います。 前回のhttp://webcyou.com/demo/js/flick/flick004.htmlの記述を若干変更します。 JavaScript function touchHandler(e){ e.preventDefault(); var touch = e.touches[0]; if(e.type == "touchstart"){ $("#txt").text(touch.pageX); startX = touch.pageX; } if(e.type == "touchmove"){ $("#txt").text(
CSS Media Queries（メディアクエリ）を使用した指定方法
このサイトは、只今WEB業界で活躍中のデザイナー、プログラマーの方々の情報を集めたweb統合情報サイトです。 web帳 CSS Media Queries（メディアクエリ）を使用したデバイスごとの指定方法です。 CSS3のMedia Queries（メディア クエリ）を使用して、デスクトップのブラウザ用をはじめ iPhone, iPadなどのモバイル用にスタイルシートの分ける方法です。 スタイルシートの分け方は ※プロパティ単位 ※ファイル単位 の2種類になります。 プロパティ単位でデバイスごとにスタイルシートを設定 スマートフォン（縦長・横長） @media only screen and (min-device-width : 320px) and (max-device-width : 480px) { } スマートフォン（横長） @media only screen and (mi
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
