TopAppleiPhone > 2012年11月
2012年11月28日

iPhoneでブックマークレットを利用する方法

November 28,2012 1:33 AM
Tag:[, ]
Permalink

iPhoneのSafariでブックマークレットを利用する方法を紹介します。iPhoneビギナー向けの記事です。iPadやiPod touchでもブックマークレットの方法は同じです。

もしかしたら他のブラウザを使えばもっと簡単にブックマークレットできるかもしれませんが、ここではデフォルトブラウザのSafariを使うための方法として紹介しています。

1.ブックマークレットとは

「ブックマークレット」とは、JavaScriptで記述したちょっとしたプログラムのことを指し、ブラウザのブックマークやブックマークツールバーに登録して利用することからこの名称となったようです。 登録したブックマークをクリックすることでブックマークレットが機能します(一部Wikipediaより引用)。

Wikipedia - ブックマークレット

2.PCとiPhoneのブックマークレット登録方法の違い

WindowsやMacのブラウザでブックマークレットを利用している方であればご存知のとおり、公開されているブックマークレットのリンクをそのままブックマークに登録すれば使えるのですが、iPhoneのSafariではブックマークレット用のリンクを長くタップしても下のようなメニューが表示されるだけで、ブックマークもできませんし、開くこともできません。またリンクをコピーするメニューも表示されません。

ブックマークレットのリンクを長くタップしたところ
リンクを長くタップ

3.ブックマークレットを登録する流れ

iPhoneのSafariにブックマークレットを登録するには、次のような流れになります(具体的な登録方法は4項以降で説明し、ここでは考え方のみ解説します)。

まず、ブックマークレットを公開する側は、ブックマークレットのJavaScriptの直前にページとして表示できるURLを付与した形で公開します。

例として、次のようなリンクになります。href属性の中にある赤色の部分がブックマークレットとして動作するJavaScriptです。

<a href="http://user-domain/index.html?javascript:window.scrollTo(0,document.documentElement.scrollHeight);">このリンクをブックマーク</a>

次にブックマークレットを利用する側は、このリンクをタップしてページを開き、ページをブックマークします。この時点ではまだブックマークレットとして機能しません。

さらにこのブックマークを編集し、そのとき表示されているURL、

http://user-domain/index.html?javascript:window.scrollTo(0,document.documentElement.scrollHeight);

から、

http://user-domain/index.html?

をまるっと削除し、ブックマークレットのJavaScript、

javascript:window.scrollTo(0,document.documentElement.scrollHeight);

のみを残して保存します。

これで登録したブックマークがブックマークレットとして機能するようになります。

4.サンプルブックマークレット

3項の練習用にサンプルブックマークレットを作りました。このブックマークレットを実行するとページの一番下にスクロールしてくれます。

まず、iPhoneでこのページにアクセスして、下のリンクをタップしてください。

一番下にスクロール

アクセスしたページで下にある真ん中のアイコンをタップ。

アクセスしたページ

「ブックマークに追加」をタップ。

ブックマークに追加

何も変更せずに「保存」をタップしてブックマークを保存します。この時点ではURLは編集できません。

ブックマークを保存

続いてURLの編集作業に移ります。ブックマークアイコンをタップ。

ブックマーク

左下の「編集」をタップ。

編集

さきほどブックマークした「一番下にスクロール」をタップ。

一番下にスクロール

ここでURLを編集できるようになるので、先頭の「http://user-domain/index.html?」を削除し、右下の「完了」をタップ。

編集

左下の「完了」をタップ。これでブックマークレットして機能するようになります。

完了

動作確認してみます。Yahoo!のページを開いてブックマークアイコンをタップ。

Yahoo!のページ

「一番下にスクロール」をタップ。

一番下にスクロール

一番下にスクロールしました。

一番下にスクロールしたところ

5.ブックマークレットを登録する方法2

3項の方法では、ブックマークレットを提供する側がiPhone用のリンクに整形してくれていますが、PC向けのブックマークレットのリンクはそのようになっていません。

おおむね次のような感じになっていると思います。

<a href="javascript:window.scrollTo(0,document.documentElement.scrollHeight);">このリンクをブックマーク</a>

このような形式になっているとリンクのコピーもできないのでブックマークレットとして登録することができません。

そこで「iPhoneでブックマークレットを簡単に登録できるようにするブックマークレット」を利用することをおすすめします。

このブックマークレットは、PC向けのブックマークレット用リンクの前に「http://ip.muumoo.jp/bm#」という文字列を付与してくれるものです。

たとえばあるページで、

<a href="javascript:window.scrollTo(0,document.documentElement.scrollHeight);">このリンクをブックマーク</a>

というブックマークレット用リンクが公開されている場合、このページを開いた状態でさきほどの「iPhoneでブックマークレットを簡単に登録できるようにするブックマークレット」を実行すれば、ブックマークレット用リンクが、

<a href="http://ip.muumoo.jp/bm#javascript:window.scrollTo(0,document.documentElement.scrollHeight);">このリンクをブックマーク</a>

に書き換わります。

これで書き換わえられたリンクをクリックすれば、ウェブページとして表示できるので、ブックマークができるようになります。

あとは3項に示した手順でブックマークのURLを編集すればブックマークレットとして利用できるようになります。

Comments [0] | Trackbacks [0]
2012年11月26日

iPhoneをウェブカメラにする方法

November 26,2012 12:55 AM
Tag:[, ]
Permalink

iPhoneをウェブカメラにする方法を紹介します。

1.接続イメージ

接続イメージは図のとおりです。iPhoneで撮影した映像を、WiFiを利用してビューワーとなるPCにデータを転送します。

接続イメージ

ということでiPhoneはWiFi接続している必要があります。3GやLTEでは使えません。

また、iPhoneとPCは同じネットワーク(=WiFiルータ)に接続されている必要があります。

本エントリーではiPhoneのウェブカメラアプリとして「EpocCam」を利用します。

2.EpocCamのインストール

まず、iPhoneに「EpocCam」をインストールします。

ホーム画面の「App Store」→「検索」をタップして「epoccam」を入力して、表示された「epoccam」をタップ。

App Store

無料版(緑)と有料版(赤)の2種類が表示されます。ここでは無料版を選択します。以降の操作はビギナー向けなので手順がお分かりの方は次項に進んでください。

EpocCam

「無料」のアイコンをタップ。

EpocCam

「Appをインストール」をタップ。

Appをインストール

必要に応じてApple IDにサインインします。

サインイン

Apple IDのパスワードを入力。

パスワードを入力

これで「EpocCam」がインストールされました。

インストール完了

3.「EpocCam Viewer」のインストール

続いてPCにビューワーをインストールします。

Kinoniの公式サイトにアクセス。

Kinoni
Kinoniの公式サイト

ビューワーはWindowsとMac版があります。ここではWinodws版を利用するので「Download Windows drivers v2.7.1」のリンクをクリック。

ダウンロードリンク

ダウンロードした実行ファイルをダブルクリックするとインストールウィザードが起動します。「次へ」をクリック。

インストールウィザード

「同意する」をクリック。

使用許諾条件

インストールフォルダを設定して「次へ」をクリック。

インストールフォルダ

コンポーネントにある「EpocCam」をチェックして「インストール」をクリック。

<br />
コンポーネントの選択

インストールが開始します。

インストール開始

途中で「このデバイスソフトウェアをインストールしますか?」というダイアログが表示された場合は「インストール」をクリックして続行します。私の場合、このあとインストールが終わるまで数分かかったのでゆっくり待ちましょう。

デバイスソフトウェアのインストール

完了しました。

インストール完了

4.接続

iPhoneの「EpocCam」をタップ。

EpocCam

起動します。iPhoneに割り当てられたWiFiルータのIPアドレスが表示されます。

EpocCam起動

iPhoneがウェブカメラに切り替わります。確認したところ、PCが同じネットワークに存在しないとウェブカメラに切り替わらないようです。

ウェブカメラ

続いてPCにインストールした「EpocCam Viewer」をスタートメニューから起動し、左下の再生ボタンをクリック。

EpocCam Viewer

接続します。当たり前ですがiPhoneとは異なるIPが割り当てられています。

EpocCam Viewer起動

これでiPhoneのウェブカメラの画像がPCの「EpocCam Viewer」に表示されました。

5.使ってみた感想

ルータの性能に依存するのかもしれませんが、動画は想像以上に滑らかな動きで、かなり良好です。私はSo-netのWiMAXですが全く問題ないレベルです。

なお、ビューワーの画面をご覧になってお分かりのとおり、左右反転されるのがちょっと残念です。また音声は拾えません。

無料版ではときどき広告が表示されます。有料版では広告が表示されないだけなのかより高機能になるのか不明ですが、無料版でも十分使えるレベルです。

Comments [0] | Trackbacks [0]
Now loading...
ギターに入った猫
掲載広告募集
Styles
Font Size
Default
For defective color vision
Gray Scale
RGB Color
Search this site

このブログをメールで購読する by:FeedBurner

AMN
Categories
Monthly Archives
2021年
2020年
2019年
2018年
2017年
2016年
2015年
2014年
2013年
2012年
2011年
2010年
2009年
2008年
2007年
2006年
2005年
2004年
2003年
BlogPeople
Syndicate this site
FeedBurner(RSS1.0/RSS2.0/Atom)
Counter
これまでのアクセス
Powered by
Movable Type 6.0.3