みかづきブログ その3

本ブログは更新を終了しました。通算140万ユーザーの方に観覧頂くことができました。長い間、ありがとうございました。

👆

引越し先はこちらです!

2017-01-01から1年間の記事一覧

CSSでロングシャドウをつくってその影で影時計をつくりました。 😎

最近、家に時計がないことに気づきました。時計機能のついたものはたくさんあるので、時間がわからなくて困ることは無いんですが、 世の中から時計という装置がどんどん減ってきてるのではないかと思いました。反面、ありとあらゆるものに時計機能が付随して…

配列のIndexにいろいろ入れてみた 😎

var arr = [0, 1, 2, 3, 4]; console.log("1"); // => 1; console.log(arr[true]); // => undefined console.log(arr[false]); // => undefined console.log(arr[[1]]); // => 1 console.log(arr[[[2]]]); // => 2 console.log(arr[0, 1]); // => 1 console.…

JavaScriptのアローファンクション(アロー関数)ではargumentsがつかえないんですね 😳

先日、 var sum = (a, b) => { var total = a + b; return total; }; sum(1, 2); // => 3 的な関数の引数を可変にしようとしまして、 var sum = () => { var total = 0; for (let i = 0, length = arguments.length; i < length; ++i) { total += arguments[…

テキストの縦位置・横位置をセンタリングしたいという想い(display: flex; align-items: center; justify-content: center;) 😇

CSS

いままで、display: table-cell とか text-align: center とか line-height(1行のときのみ)とか色々頑張ってきたけど、今後はflexboxをつかうと決意した。 なんていったって、いままでの試行錯誤と違って専用のプロバティだし。 CSS .box { display: flex;…

iOS10.2でdocumentに張ったmousemoveが発火することがある 😭

仕様かバグかは調べてないのですが、iOS10.2では発火することがありました。詳しい発生条件はわかりませんが、挙動を見るに、少なくとも、 touchstart => touchend の間に touchmove を挟まない touchstart => touchend の間隔を0.1秒程度以下にする の2つが…

JSONにコメントを描き込みたいという想い 😭

JSONをつくる際に、 { index : 3, // 背番号 name : "サブロー" } という感じでコメントを入れてしまうとエラーになります。 なので、いつも泣く泣く、 { index : "COMMENT: 背番号", index : 3, name : "サブロー" } という感じで、 key名を重複させてコメ…

Googleハングアウトの入力ソースを切り替える

最近Googleハングアウトを使う機会が多いのですが、カメラソースを変更しようと思ってURLバーのカメラアイコンをクリックしたのですが、切り替えることができません。設定から普通に変更できました。

解約したiPhone6をアクティベートする(au編)

iOS

先日 iPhoneSEを購入し、UQモバイルに乗り換えた ことによって、余ったiPhone6ですが、下取りには出さずに検証機として活用することにしました。kimizuka.hatenablog.com なので、一旦初期化したところ... アクティベートできなくなりました!(T_T) auで…

iPhoneで撮影した動画をffmpegで無音にしたい

Mac

無音にしたいだけなのにいちいちiMovieとかで編集するのが面倒だったのでプログラムでなんとかならないかと思い、 いろいろ調べた結果、ffmpegで処理することにしました。Macであればffmpegを導入するのはとても簡単です。kimizuka.hatenablog.com ffmpegで…

auからUQモバイルに乗り換えたらスマホ代が4分の1になりました。

金額にして月々の料金が6,000円ぐらい安くなりました。auに不満があったわけでも、UQモバイルに恩義があるわけでもないのですが、 事実として、僕の使い方だとau時代に8,000円ちょいだったスマホ代が2,000円弱になりました。 どこかにきっと同じような人がい…

CSSアニメーションで画面がちらつく場合は -webkit-backface-visibility: hidden; で解決する場合がある

CSS

大体1年前の記事で取り上げたUIをブラッシュアップしている時に気づきました。kimizuka.hatenablog.com 解決前DEMO カードをドラッグした時に、テキストが点滅するんです。 本当は制作当初から気になっていたんですが、原因もよくわからないし放置していまし…

フラットデザイン、マテリアルデザインを目コピーする(スライダーUI編)

年末にアドベントカレンダーで こちらの記事 を執筆させていただいたのですが、それからというものアプリっぽいUIをCSSでつくることにハマっています。techblog.kayac.com 以前から、トグルボタンとか、kimizuka.hatenablog.comドロワーメニューとか、kimizu…

iTunesのようにスクロールできるUIをつくる

overflow: scroll をつかってiTunesのようにスクロールできるUIをつくってみました。 本当のiTunesにはスクロールバーがついているのですが、なんとなく無い方がかっこいい気がして消しています。 基本的にはCSSのみでつくっているのですが、左右に薄くはい…

Mac版Chromeでトラックパッドを2本指でスワイプした時にブラウザバックしてしまう現象をなんとかする

Mac

あけましておめでとうございます。 昨年から、いや、もしかしたらもっと前から、ずーっと僕を悩ませていた現象を1つ解決できたので解決方法をまとめておきます。 現象 その現象がこちら。わかりますか? Mac版のGoogle Chromeなんですが、トラックパッドを2…