ゆたんぶろぐ

気が向いたら書いてます

sass

都巡りガイドアップデート

一部機能の追加や改修を行いました。1. 検索ボックスにおいてのサジェスト機能を追加 文字を入力すると、その文字を含んだスポットの一覧が表示されるようになりました。 2. コインロッカーをスポットに追加 各電鉄会社が提供している構内図を元に(位置をざ…

都巡りガイドリニューアル

しばらく放置してたので、4 年ぶりのリニューアルを行いました。今回の主なポイントは以下です。1. ルート案内は Google 先生に任せて、駅・バス停のスポットを削除Google 乗り換え案内へのリンクを表示2. 天気予報の表示3 時間ごとの予報と雨雲レーダーの表…

更新したファイルに該当するタスクだけ走らせる Gruntfile

grunt-contrib-watch って便利なんですが、監視ファイルが多くなる=走る処理が多くなるとどうしても時間がかかってしまいます。それでなんだか効率が落ちてたりするわけなんですが、grunt-este-watch が幸せということを聞いて、ぼくも幸せになりたいと思い…

Wikipedia Mobile のようなスライドメニューを簡単に作る

Wikipedia を iPhone で見ると、左上にメニューボタンがあって、それをタップすると左からメニューが表示される、まぁよくあるタイプですが、簡単に実装しましょう。開閉の制御は jQuery、アニメーションはヒマなんで CSS3 でやりましょう。 HTML <nav> <a href="#">link</a> <a href="#">link</a> <a href="#"></a></nav>…

IE8 でも box-shadow を使う

最近、案件での IE 最低ラインが 8 になってきました。とても喜ばしいことですが、8 が良いわけではなく、7 や 6 といった不良仲間で確認しなくても良くなった、というだけです。さて、デザイン内に影がついていることはフラットデザインが流行っている今で…

grunt のインストールから初回 grunt までコマンド一発で完了させるターミナルシェルスクリプト

grunt 便利ですね! でもいちいちインストールするのめんどくさいんです!時間の浪費、ではなく、めんどくさいんです!ということで、grunt のインストールから初回 grunt 実行まで一発で終わらせるシェルスクリプトです。あ、毎度のことながら Mac 環境です…

Gruntfile.js を CoffeeScript で書いて見やすくする

みなさん grunt 使ってますか?便利ですよ!さて、「Gruntfile.jsは.coffeeのほうが扱いやすい ::ハブろぐ」を見ると、Gruntfile.js を CoffeeScript で書いてもちゃんと grunt さんは認識してくれるらしいので、CoffeeScript で書いてみました。以下は grun…