サポート » テーマ » モバイルでギャラリーを使う際、画像サイズを変えたい

  • 解決済 01bac

    (@01bac)


    いつもお世話になっています。

    PCでブログを書く際にギャラリーを利用しているのですが、元画像を980pxにしていてモバイルでみると凄い見にくい状態になってしまいます。
    モバイルで見た時はモバイルで表示できるくらいの大きさにしたいのですがどうすればいいでしょうか?

6件の返信を表示中 - 1 - 6件目 (全6件中)
  • こんにちは

    CSSで max-widthを調べてみてください。

    トピック投稿者 01bac

    (@01bac)

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

    max-witdhを980にするとパソコンでみると980pxで表示されると思うんですが、モバイルで表示させたい場合はどうすればいいんですか??

    こんにちは

    以下のページを、確認してみてください。
    http://tenman.info/hatena/expand-height-issue.php

    extra column とか page width のカラムの中にあるリンクをクリックするとレイアウトが変化しますが、画像がはみ出る事はないと思います。

    ワードプレスのテーマ(管理画面から直接インストールできるテーマ)は、投稿エリアよりも大きな画像を貼り付けても、はみ出さないように設計されていますが、それは、max-widthに100%などの値をセットする事で実現しているケースが多いです。

    ワードプレスのテーマのimgに対するスタイル指定を調べてみるといいと思います。

    トピック投稿者 01bac

    (@01bac)

    返信ありがとうございます。

    なるほど・・・なんとなくはわかりました。
    下記が自分のギャラリーの中身になるのですが、galley imgにmaxとminを設定するとギャラリーの中身の大きさではなく記事内のギャラリーの画像の大きさが指定した大きさになってしまします。
    記事内のギャラリーの大きさはそのままで、クリック後のライトボックス内を指定した大きさにしたい場合はどうすればいいのでしょうか??

    <ul class=’gallery’><dl class=’gallery-item’>
    <dt class=’gallery-icon’>
    <img width=”310″ height=”150″ src=”http://blackartcard.com/wp/wp-content/uploads/2012/05/IMG_1112-310×150.jpg&#8221; class=”attachment-thumbnail” alt=”IMG_1112″ title=”IMG_1112″ />
    </dt></dl><dl class=’gallery-item’>
    <dt class=’gallery-icon’>
    <img width=”310″ height=”150″ src=”http://blackartcard.com/wp/wp-content/uploads/2012/05/IMG_1115-310×150.jpg&#8221; class=”attachment-thumbnail” alt=”IMG_1115″ title=”IMG_1115″ />
    </dt></dl><dl class=’gallery-item’>
    <dt class=’gallery-icon’>
    <img width=”310″ height=”150″ src=”http://blackartcard.com/wp/wp-content/uploads/2012/05/IMG_1116-310×150.jpg&#8221; class=”attachment-thumbnail” alt=”IMG_1116″ title=”IMG_1116″ />
    </dt></dl>

    こんにちは

    なるほど・・・なんとなくはわかりました。
    下記が自分のギャラリーの中身になるのですが、galley imgにmaxとminを設定するとギャラリーの中身の大きさではなく記事内のギャラリーの画像の大きさが指定した大きさになってしまします。

    すみません、おっしゃってる意味がよく理解できません

    私の、超絶不人気テーマで恐縮ですが、

    http://www.tenman.info/wp3/obandes/quick-start-obandes/

    のなかに、とっても小さな、ギャラリーのサンプルがありますので、何かの参考になれば幸いです。
    最近、このテーマやさしいレスポンシブに作り変えたので、このテーマを使ってギャラリーページを表示して、どんなスタイルが当たっているか等、お役に立てばうれしいです。

    記事内のギャラリーの大きさはそのままで、クリック後のライトボックス内を指定した大きさにしたい場合はどうすればいいのでしょうか??

    ライトボックスのプラグイン等は、使っていないので、申し訳ありませんが、私からは、お答えできません。 ごめんなさい。

    トピック投稿者 01bac

    (@01bac)

    なるほど・・・勉強なりました!

    とりあえず今回はライトボックスのCSSにmax-widthをいれてなんとか解決しました!

6件の返信を表示中 - 1 - 6件目 (全6件中)
  • トピック「モバイルでギャラリーを使う際、画像サイズを変えたい」には新たに返信することはできません。