- ベストアンサー
スマートフォンで大きな画像を端末に合わせて表示
スマートフォンサイトを制作しているのですが、大きな画像を端末に合わせて（自動的に）横幅いっぱいに表示したいと思っています。 どのような方法があるのでしょうか？
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
関連するQ&A
- スマートフォンの画像サイズ
スマートフォンのデザインを640pxで制作し、スマートフォンサイトを構築中です。 viewport の設定を <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=yes" /> とし、画像を640pxで制作したサイズで切り出していますが スマートフォンで実機確認すると、縮小されず、倍のサイズで表示されてしまいます。 幅640pxで作成したデータを、半分に縮小したもの（320px）を画像として切り出すのが正しい方法なのか、それとも、切り出した画像の<img … width=" 半分のサイズ ">にするのでしょうか？ それとも、幅640px で作成した画像を切り出して、自動的に縮小されるようにする方法があるのでしょうか？ いろいろ調べたのですが、よくわからず（調べ方も分からず…）困っています。 無知で申し訳ないのですが、よろしくお願いいたします。
- 締切済み
- CSS
- スマフォサイト制作での画像幅の拡大縮小について
２枚の画像バナーを横に並べたいのですが、 端末画面の横幅を想定して画像を作成してしまうと、 横に回転して閲覧した際小さく表示されてしまいます。 これを拡大させて表示させたいです。 文章が分かりづらいので画像を添付しました。 あくまで例なのですが、 480×854のスマフォ端末を想定した場合、 画像バナー（各リンク設定あり）を225pxの横幅で表示し、 バナーの上下左右に10pxの余白を残したい時。 これを横回転した際（854×480）、 横幅225pxで固定して作成しまうと、 バナーが小さく表示されてしまいます。 これを、横回転した時にも拡大されるようにしたいのです。 端末によっては480px以上に横幅の広い画面もあるかと思うので… 縦幅がその分広がっても構いません。 横１枚画像を置きたいのであれば、 width:100%;で対応可能かと思うのですが、 画像バナーそれぞれにリンクを設置したいので 別箇要素を設けたいです。 考え方としては、paddingの幅を固定にして、 画像を端末によってブロック要素の横幅100％まで拡大できるように できれば理想なのですが… スマートフォンサイト制作で詳しい方、 何か策がございましたら、ご教授いただけますと幸いです。 よろしくお願いいたします。
- 締切済み
- CSS
- 携帯サイトで画像がつぶれる
お世話になります。 携帯サイトを制作しているのですが 画像を端末（新しいものでも）でチェックすると つぶれてしまっています。 ＰＣではきれいに見えますが ドットで起こしてもつぶれてしまいます。 横幅240pxには収めているのですが、 携帯サイト用の画像で ＰＣ上で見るのに近く綺麗に見せるには どうしたらいいでしょうか・・・
- ベストアンサー
- HTML
- 携帯サイトで画像を表示する場合・・・・・・
サイトによっては画面サイズの横幅いっぱいに画像が表示されていますが、 これはどうやればいいのでしょうか？？？ 携帯サイトの場合機種・キャリアによって画面のサイズも違うので、いつも画像を小さめにして、どんな大きさの画面でも見えるようにしています。 出来れば画面いっぱいに画像を表示したいのです。 画面サイズに関係なく、いっぱいいっぱいに表示することは可能でしょうか？ 可能な場合、特別なＨＴＭＬタグなどがあるのでしょうか？ どうか教えてください、宜しくお願いします。
- ベストアンサー
- その他（スマートフォン・携帯・タブレット）
- 携帯画面の横幅ピッタリの画像って？
携帯電話のサイトを作っているのですが、参考にいろいろと携帯サイトを見てまわっていると、たまにタイトル画像が携帯画面の横幅いっぱいのものを使っているサイトがあります。 私の携帯は240x320pixelなのでこのサイトの画像は横幅が240pixelなのだと思うのですが、携帯画面の大きさは携帯機種によっていろいろあると思います。 そうした場合に、どうやってタイトル画像を横幅をピッタリ合わせているのでしょうか？ もしかして携帯機種を判別して横幅が違う画像を用意しているのでしょうか？ また、試しに横幅240pixelの画像を作って自分の携帯で表示させてみたら微妙に横幅が縮小されてしまいました。どうやら240pixelいっぱいには表示できないようです。これはなぜでしょうか？
- 締切済み
- HTML
- スマートホンのサイトで画像が表示されないのは何故？
パソコンで見ると画像が表示されるのに、スマートホンだと一部の画像が表示されなくなります。 原因は、何でしょうか？ スマートホンやi pad は、表示されるデータ容量が小さくなるから表示されないのでしょうか？ それとも、画像そのものの容量が軽くないと表示されないのでしょうか？ でも、大きな画像は表示されてるのにとても小さな画像は表示されていない現象もあります。 考えられる原因など何かアドバイスいただければ幸いです。
- ベストアンサー
- その他（スマートフォン・携帯・タブレット）
- スマートフォン制作の画像サイズについて
近年、あまりにもサイズが多様化している スマートフォンの画像サイズについて、お聞かせください。 この度、写真をスライドさせるUIをスマートフォンでつくる予定です。 これまでのスマートフォン制作では640pxで主に画像を作っておりました。 ただ、現状、スマートフォンの解像度が多様化しているので いったい、今の主流としてサイズはいくつで作るのが ベストなのかな…と毎回、悩んでおります。 Portrait、Landscape両方に対応予定です。 小さくしても、写真画像なので大きな劣化はないことは承知しているのですが、 写真の上に文字も少し載せる画像になります。 通信が重くならず、あまり劣化が気にならないサイズについて アドバイスをいただけたら助かります。 スマートフォンサイトの制作について お詳しい方、よろしかったら、ご教授いただけたらと思います。 何卒よろしくお願いいたします。
- ベストアンサー
- HTML
- スマートフォンでWebサイトの背景画像が縮小する
お世話になります。 現在自社にて公開しているWebサイトがあるのですが、背景にはかなり大きめの一枚画像(2500×2500px)を使用しています。そのせいか、iPhoneやiPadなどのスマートフォン関連の端末で閲覧してみると背景だけ縮小して表示され、レイアウト的に少しおかしなことになります。 これは解決する方法はあるのでしょうか。ネットで少しだけ調べてみましたら、背景画像は大きな画像は使わず、小さな画像をrepeatして使用するようにということでした。 それで質問なのですが、スマートフォン向けの画像とCSSを別途用意して、スマートフォンなどで閲覧するユーザーだけにCSSを適用する、そういったことは可能なのでしょうか。 もし可能ならどのように記述すればいいのか教えていただけないでしょうか。 よろしくお願い致します。
- ベストアンサー
- CSS
- 携帯ホームページで横480の画像を表示させるには
携帯ホームページで横480の画像を表示させるには 私は携帯でイラストサイトを運営しています。 今までは横幅230pxの画像のみを展示していたのですが、大画面の携帯に買い換えた祭、そのサイズだと画像が小さくてモザイクがかかっている様に表示されます。 他の創作サイト様を拝見させていただいていると、たまに横幅480px(VGA？)サイズの画像を見かけるのですが、このサイズだととてもキレイに画像が表示されます。 そこで我がサイトでも横幅480pxの画像を230pxのものとは別に展示したいと思ったのですが、自分の携帯のデータフォルダ内では表示されるのに、webに上げると表示されなくなってしまいます。 横幅480pxの画像を携帯サイトで表示させるには、何か特別な手順を踏まなければいけないのでしょうか。 どなたか回答おねがいします。
- ベストアンサー
- その他（スマートフォン・携帯・タブレット）
- スマートフォン用画面の文字を非表示にしたい。
OpenPNE 3.8.8 を使って、SNSサイトを制作中の者です。 スマートフォンから、自分の作ったサイトを見ると、新規登録画面とパスワード変更画面にに、「スマートフォン表示に切り替え」というリンクが表示されるのですが、リンクを押しても、スマートフォン表示に切り替わらないため、「スマートフォン表示に切り替え」という表示を、非表示にしたいと思っています。 ネットで調べると、次のような回答がありましたが、バッチの適用の仕方がわからず、困っています。 http://support.pne.jp/blog/support_info20130502.html よろしくお願いします。
- ベストアンサー
- フリーウェア・フリーソフト
