CSSでiPhone本体の素材をつくるその2

CSS

kimizuka.hatenablog.com以前、CSSでiPhone5をつくったことがありましたが、流石に古くなってきたので、iPhone7につくりかえてみました。以前のコードと比べると、要素数が少なくなっていて成長を感じますね。（before、after、box-shadowをつかうようにな…

2017-06-23

Nginxで404ページをカスタムする

Mac

404.kimizuka.fmどうしても404ページでNOT FOUNDを流したかったので、近所のサーバサイドエンジニアに頼み込んで設定方法を教えてもらいました。/etc/nginx/conf.d/ 以下に hogehoge.conf という設定ファイルをつくり、 server { ... error_page 404 /404.ht…

2017-06-22

連続する2つのツイートで1つのイラストを完成させるツイートボタンつくりました。 🐳

つくったもの

1行でまとめるとこんな感じのことができるツイートボタンをつくりました。はじめにこどもの頃、FF6で連続魔が使えるようになったとき、最強じゃないかと思いました。https://itunes.apple.com/jp/app/final-fantasy-vi/id719401542?mt=8&uo=4&at=10l16903…

2017-06-21

はじめてのPixiJS 😇

JavaScript

いままで2DのものをつくるときはCanvasのAPIを直接叩いていたんですが、ふと、ライブラリをつかってみようとおもいPixi.jsを試してみることにしました。ドキュメントに目を通しながら探り探り書いたコードをメモしておきます。 JavaScript // tickerをつ…

2017-06-15

iPadとかSurfaceとかを業務用のシステムに使いたい場合に他のアプリを使えないように制限をかける方法まとめ 📱

iOS

はじめにかつては業務用の専用機器の一部がiPadとかSurfaceに置き換わっていっています。例えば、よく行く回転寿司屋はメニューがiPadになってますし、おいしいアップルパイ屋さん「RINGO」のレジはiPad（一部店舗だけかもしれませんが）ですし、サイゼリ…

2017-06-14

CloudFlareでhttpsに対応させたページにhttpでリクエストが来たときにリダイレクトさせたいという想い 🤔

Mac

以前、無料でhttpsの環境を手に入れるために導入したCloudFlare。大変便利に活用させていただいております。kimizuka.hatenablog.comこれまでは何も考えず、httpのアクセスをhttpsにリダイレクトする処理をフロントで行っていたのですが、よくよく考える…

2017-06-13

iOS10でYouTubeをインライン再生＆複数同時に再生するサイトをつくれるか検証する 📱

iOS YouTube JavaScript

結論（2本目以降をミュートにすれば）できる！ kimizuka.hatenablog.com昨日の検証で、iOS10であればYouTubeをインライン再生することが難しくないことがわかりました。kimizuka.hatenablog.com以前、PC向けにYouTubeの動画を2本同時に再生するサイトをつ…

2017-06-12

iOS10でYouTubeをインライン再生＆自動再生＆ループ再生を試してページの背景がムービーのサイトをつくれるか検証する 📱

iOS YouTube JavaScript

結論できる！ kimizuka.hatenablog.com以前、iOS10のビデオタグの挙動を調べましたが、 videoタグを直接使う機会よりも、YouTubeをつかう機会の方が圧倒的に多いため、YouTubeの挙動を調べてみました。iOS10のビデオに関しての仕様を整理すると、 playsinl…

2017-06-09

iOS11ベータ版向けにつくったウェブコンテンツのデバックはSafari Technology Previewの手を借りると楽々 😀

iOS Mac JavaScript

最近、iOS11のSafari向けにコンテンツをつくって試してみることが多いのですが、ウェブカメラをつかうコンテンツを試しているので実機で確認する必要があり、ライトニングケーブルでMacと繋いでデバッグしながら開発を進めたいのですが、通常のSafariで…

2017-06-08

「彼女とデイトなう」につかえるスクリプトを書きました。 😆

つくったもの JavaScript

はじめにこちらのツイートがとても話題になってますね。そんなこんなで、ブームにのって、「彼女とデイトなう」を実装してみたいと思います。仕様まあ、ネーミング先行で中身をなにも考えてなかったので考えます。 Date.now();を実行すると、コンソールに…

2017-06-07

iOS11向けにウェブARコンテンツをつくってみました。（マーカーレスの超簡易版） 🏃

つくったもの iOS JavaScript CSS

追記：（2017/06/09 00:16）本記事内に掲載している動画キャプチャが、 Apple.Incの開発者利用規約（APPLE BETA SOFTWARE PROGRAM AGREEMENT APPLE INC.）に抵触しているというご指摘をいただきました。掲載内容を不適切と判断し、該当箇所を削除させてい…

2017-06-06

ターミナルで画像をbase64にするぞ 😀

Mac

SublimeText2から3に乗り換えて、唯一の不満が画像をbase64に変換するところ。2では、画像をエディタにドラッグ＆ドロップするだけでbase64化してくれるプラグインがあったのですが、kimizuka.hatenablog.com3では見当たらず。探し方が悪いだけかもしれませ…

2017-06-05

いつの間にかaddEventListenerの第3引数にuseCaptureではなくAddEventListenerOptionsを渡せるようになっている。 😮

JavaScript

ことのはじまりきっかけはこの警告でした。 [Intervention] Unable to preventDefault inside passive event listener due to target being treated as passive. See https://www.chromestatus.com/features/5093566007214080 touchmoveが発火する度になん…