ドットインストール代表のライフハックブログ
![IDEA * IDEA](https://cdn-ak-scissors.b.st-hatena.com/image/square/a906559927662481b6239ae860cae2433b099a91/height=288;version=1;width=512/http%3A%2F%2Fwww.ideaxidea.com%2Fwp-content%2Fuploads%2F2014%2F05%2FXSS-game.png)
たまにキャンペーンやプロモーションサイトでスマフォとPCが連携してスマフォから操作するとPCサイトで何か変化が起きるWebサイトをみてこれやってみたいと思い簡単な連携をやってみた。 連携のデモはこちら(iPhoneしか確かめてないです) スマフォ(iPhoneしか確かめてないです)でQRを読み込むと専用ページが表示されるので端末を傾けるとパンダが動きます。そして、その状態でPCサイトを見るとPCサイト側のパンダも一緒に動きます。 PCサイトとスマフォを紐付けるためにPCサイトを表示したときに専用のコードを発行してQRコードを作ります。そのQRコードをスマフォで読み取ると現在開いているPCサイトと紐付けることができます。 スマフォ側ではそのコードを使って操作情報をサーバーに送信します。この時Ajaxを使って非同期でサーバーに送りDBに保存します。 PC側では、非同期で定期的にDBへ情報を取得
CSSで長さを計算できるcalc()ファンクションというのはご存じですか? ここのところ流行りのレスポンシブデザインもそうですが、コンテンツの幅をフレキシブルに対応させたいという場合に、とても役立つファンクションです。 今回はこのcalc()ファンクションの使い方や、ブラウザのサポート状況をご紹介したいと思います。 親要素の幅を超えないようにする calc()ファンクションにはいろいろな使い方があるんですが、代表的なところで言えば画像などのコンテンツ幅が親要素の幅を超えないようにするという使い方。 通常、コンテンツ幅をフレキシブルに対応させるだけなら、CSSのmax-widthプロパティに対して100%と値を指定すりゃいいわけです。 しかし、ここにpaddingやborderといったプロパティを与えた途端に、親要素の幅をサラリと超えてきやがります。子の成長が著しい。 paddingを与えた
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く