FireMobilesimulatorの使い方は？

こんにちは。

私はウェブサイトを作っている者です。スマートフォン対策としてFirefoxに「FireMobilesimulator」を導入して使用しています。これの使い方を教えて頂けないでしょうか？

・1つのFirefoxウィンドウでPC用とスマホ用2つのタブで見たい。
・スマホ用のページにするためにはFirefoxのウィンドウの左右を短くしなければならない。
・こうならない使い方はあるのか？

以上、どなたかご存じの方、ご教示願えないでしょうか？

No.2 ベストアンサー 回答者： t_ohta 回答日時： 2013/02/18 13:49

FireMobilesimulator では「@import url("smartphone.css") screen and (max-width:480px);」を指定しても対応できません。

ブラウザの幅を設定している訳では無く、受け取ったHTMLを表示する際に表示の幅を制限して表示しているだけなので、ブラウザ本体が認識している幅はウィンドウの幅です。

プラグインが関与できる機能範囲の問題ですので、たぶん他のシミュレーターでも同じだと思います。

この回答への補足

ご回答ありがとうございます。

htmlに直接、

<link href="css/pc.css" media="screen" rel="stylesheet" />
<link href="css/smartphone.css" rel="stylesheet" media="screen and (max-width: 480px)" />

と表記してもFireMobileSimulatorではウィンドウの幅を変えない限りは出来ませんでした。

Mobilizerを使ってみましたが、これはhtmlに直接書いても@importで指定しても出来ました。

すみません。

補足日時：2013/02/18 17:33

No.1 回答者： t_ohta 回答日時： 2013/02/18 11:24

＞　1つのFirefoxウィンドウでPC用とスマホ用2つのタブで見たい

オプション設定の全般の項目で「タブごとに端末を選択する」にチェックを入れるとタブ単位でシミュレートする機種が選択できますので、端末設定を解除したタブとスマホの機種を選択したタブを用意すると切替えて見比べられます。


＞　スマホ用のページにするためにはFirefoxのウィンドウの左右を短くしなければならない

オプション設定の全般の項目で「表示領域の横幅を端末に合わせる」にチェックを入れ、端末設定で機種毎のスクリーンの横幅を設定しておけば、ウィンドウ幅を変えなくても指定した横幅で表示されます。

この回答への補足

ご回答ありがとうございます。

> オプション設定の全般の項目で「タブごとに端末を選択する」にチェックを入れるとタブ単位でシミュレートする機種が選択できますので、端末設定を解除したタブとスマホの機種を選択したタブを用意すると切替えて見比べられます。

はい、これは指定してあります。


> オプション設定の全般の項目で「表示領域の横幅を端末に合わせる」にチェックを入れ、端末設定で機種毎のスクリーンの横幅を設定しておけば、ウィンドウ幅を変えなくても指定した横幅で表示されます。

これもチェックしてあって、例えば「Xperia acro IS11S」でスクリーン横幅は480pxになっているのですが、

@import url("smartphone.css") screen and (max-width:480px);

で指定してあるsmartphone.cssを読み込んでくれません。ウィンドウ幅を変えないと読み込んでくれないのです。


すみません、よろしくお願いいたします。

補足日時：2013/02/18 12:11