Analogstudio

アナログ回路、車、写真、PCなどに関するブログ

インスタグラムのタイムラインを表示しよう!「Instagram API」の使い方

インスタグラムのタイムラインを表示しよう!「Instagram API」の使い方

流行りの SNS と言えばインスタグラムがあるでしょう。
せっかくなのでタイムラインを Web サイト上に表示したいですよね。

しかし、いざやろうとタイムラインを表示しようと思っても簡単にはできません。
そこで、今回はインスタのタイムラインを Web サイト上に表示させる方法を紹介します。
続きを読む 紹介インスタグラムのタイムラインを表示しよう!「Instagram API」の使い方

Javascriptのイベント登録に於けるイベントハンドラとaddEventListenerの使い分け

Javascriptのイベント登録に於けるイベントハンドラとaddEventListenerの使い分け

9月も終わりに近付き猛暑だった日が懐かしく感じる季節となりました。

さて、今回は Javascript でイベント処理をさせる時に使う「イベントハンドラ」(要素セレクタ.on****) と「addEventListner関数」の使い分けについてです。
どちらもイベントを同じように登録できますが、微妙に違うところがあります。
続きを読む 紹介Javascriptのイベント登録に於けるイベントハンドラとaddEventListenerの使い分け

Google Chrome の開発者ツールでできることアレコレ

Google Chrome の開発者ツールでできることアレコレ

毎日毎日、最高気温を更新している今日ですが如何お過ごしでしょうか?
私は幸いにも暑さには慣れているので割と快適に過ごしております。

そんなうだるような日常の休閑話題として、Google Chrome や Opera の開発者ツールのアレコレについて紹介します。
どちらのブラウザも殆ど同じなので Google Chrome を使っていきます。
※開発者ツール自体についてはいくらでも紹介記事があるので、本記事では “痒い所に手が届く” 小技を紹介することとします。
続きを読む 紹介Google Chrome の開発者ツールでできることアレコレ

Javascriptでウィンドウのリサイズやスクロールイベントの発生回数を抑える小技

Javascriptでウィンドウのリサイズやスクロールイベントの発生回数を抑える小技

Javascriptでウィンドウのリサイズやスクロールを検出して処理を実行することがあります。
そんな時に使う「window.onresize」や「window.onscroll」は何も対策をしないともの凄い数のイベントが発生してしまいます。

そこで、そんなイベント発生回数を抑える小技を紹介します。
スクロールイベントに重い処理を行おうと考えている方は一考の価値があると思います。
続きを読む 紹介Javascriptでウィンドウのリサイズやスクロールイベントの発生回数を抑える小技

iPhoneでhoverやclickイベントが思い通りにならない場合の処方箋【CSS】【Javascript】

iPhoneでhoverやclickイベントが思い通りにならない場合の処方箋【CSS】【Javascript】

Webサイトを設計する際にPCやAndroid端末では想定通りの動作をするのにiPhoneだけはうまくいかないことがあります。

そこで、今回はそうなってしまった場合にどのように対処するかをまとめます。
続きを読む 紹介iPhoneでhoverやclickイベントが思い通りにならない場合の処方箋【CSS】【Javascript】

WebサイトのIE5~11までの動作確認をする方法とCSSプロパティが有効か調べる方法

WebサイトのIE5~11までの動作確認をする方法とCSSプロパティが有効か調べる方法

Webサイトをデザインしていると古いブラウザへの対応が気になりますよね。
特に昔からずっと鬼門だったIEへの対応は骨が折れます。

2018年現在では既にIE10以前はMicrosoftのサポート外になりました。
(最終アップデートは2016年1月)
しかし、サポートが切れたブラウザも少なからず使っている人もいます。

そこで、古いIEで作成したWebサイトがどのように表示されるのか確認する方法を紹介します。
続きを読む 紹介WebサイトのIE5~11までの動作確認をする方法とCSSプロパティが有効か調べる方法

写真の基礎!基本構図についてまとめます。

写真の基礎!基本構図についてまとめます。

写真を撮ってもどこかキモチワルイと思ったことはないでしょうか?
せっかく一眼レフやミラーレスのような綺麗に撮れるカメラでもこれでは悲しいですよね。

そんな時は構図について考えてみたら解決の糸口が見つかるかもしれません。
そこで今回は構図についてまとめたいと思います。

基本の構図を考えやすくする線を簡単に写真に重ねるページも作ったので、ご活用下さいませ。
続きを読む 紹介写真の基礎!基本構図についてまとめます。

Webサイトを作る時に気を付けていること

Webサイトを作る時に気を付けていること

Webサイトを作成する時、皆さんはどんなことに気を付けていますか?
個人でコーディングからWebサイトを構築する方は (現在では) 殆どいないと思いますが、もし作るという方は参考になるかもしれません。

今から15年ほど前のインターネットが浸透し始めた頃は自分でコーディングして運営しているという人が沢山いたんですけど、最近ではWordpressなどをはじめとするCMSを利用したブログ形式が殆どでしょう。
CMSはHTMLやCSS, Javascriptに詳しくなくても手軽に始められるメリットがあります。
コーディング時代は終わりに近づいていることは確実です。

しかし、個人レベルでWebサイトを運営する場合はやはりCMSに頼らない方が自由が利いて管理も簡単になる場合も少なくないと思います。
ページ数が膨大でない場合はシンプルな環境となります。
今回の記事はそんな方を対象に書いていきたいと思います。

ZipCloudの郵便番号検索をSSLに対応させる方法【PHP】

ZipCloudの郵便番号検索をSSLに対応させる方法【PHP】

先日、本ブログをSSL化したという記事を書きましたが、以前投稿した記事にSSLに対応できないものがあったのでその修正方法を書いていきます。

SSL化に対応していのは、郵便番号から自動で住所を表示させる方法で投稿したコードです。
郵便番号検索のデータベースとして株式会社アイビスさんのZipCloudを使用させて頂いていますが、こちらのAPIはSSLに未対応です。
ですので、以前のコードをそのまま流用するとSSL化したサイトではブラウザによってブロックされてしまうことがあります。
続きを読む 紹介ZipCloudの郵便番号検索をSSLに対応させる方法【PHP】

写真ギャラリー用のテストページを作りました

写真ギャラリー用のテストページを作りました

写真ギャラリー用のテストページを作ってみました。 Sample1 Sample2 ご興味のある方がおりましたら、解説記事を作ろうと思います。 コメントやお問合せからご意見をお聞かせ頂けると助かります。 <Sample2か続きを読む写真ギャラリー用のテストページを作りました[…]