800x600の画面だと、HPに横スクロールが出てしまって
見づらくなってしまいます。

サイトを見てくれてる人の画面によって
レイアウトを自動的に横スクロールが出ないように
レイアウトする事って出来ないのでしょうか??

確か、それが出来るようなソースがあったような気がしたんですけど
すっかり忘れてしまいました(泣)

A 回答 (3件)

こんにちは。



通常のHTMLだけでは、個々の人のディスプレイに合わせるのは、難しいでしょうね。
nyanchuさんの回答通り、最小のサイズに合わせなければなりません。

どうしても・・・と言う場合には、JavaScriptを使用すれば可能です。
横スクロールを無くす為には、横のサイズを個々のディスプレイのサイズを取得して、<TABLE>でWIDTHを固定してしまえば良い訳です。


一応、ソースを載せて置きます。

<HTML><HEAD><TITLE></TITLE></HEAD><BODY>

<SCRIPT Language="JavaScript">
<!--
Screen_Width=screen.width *0.8;
document.write('<table width='+Screen_Width +' border=1>');
// -->
</SCRIPT>

<TR><TD>テストだよん</TD></TR></TABLE>
</BODY>
</HTML>
試してみてください

ps.画像サイズをフルだと、結局横スクロールするので、画面サイズ×80%にしてあります。
    • good
    • 0

いまいち意図がわからなくて申し訳ありませんが、コンテンツをwidth="100%"等の%で幅指定したテーブルの中に作ってはどうでしょうか。

そうすればテーブルがのびちぢみし、どのブラウザでも、そのウィンドウの割合で表示されます。もちろん文章は自動改行です。
しかし、画像を使ったり、きちっとしたレイアウトを組むには、「どのサイズ画面でも全体を表示させる」ためには、640×480等の小さい画面で見られるように作るしかないのでは?
    • good
    • 0

すべての人に横スクロールがでないように作るには、みてくれる人の中でいちばん小さい画面をターゲットにつくらなければなりません。

スクロールバーをでなくするということは、小さい画面のひとは、見えない部分をみるなということになってしまいます。

この回答への補足

いえ、いえ、そういう意味ではなくて
スクロールバーを出さないで、
どのサイズ画面でも全体を表示させる方法は無いか。
という事です。自動改行とか。
そういう事は無理でしょうか?

言葉足らずですみません。

補足日時:2002/03/25 14:24
    • good
    • 0

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

Qなぜ石油販売価格は生協が基本なのでしょうか?。

いつもこの時期になると生協の石油販売価格がニュースなどで流れます。
石油会社は生協の価格を基本として価格設定してるようです。
生協の石油販売量ではそれほど多いとは思えないのですが、どうして毎年生協の価格が公表されるのでしょうか?。

Aベストアンサー

生協というよりは札幌生協ですね。
「石油会社が生協の価格を基本として価格設定する」というよりは、「大手石油元売と札幌生協との交渉結果がそのシーズンの灯油価格の指標として注目される」というのが正しい表現だと思います。

そもそも石油業界にはチャンピョン交渉という考え方があり、大手供給者と大手需要家が業界を代表して、都度需給バランスや国際市況を反映した価格交渉を行い、他の供給者と需要者はその結果を自分たちの取引価格の参考とする習慣があります。
現在でも比較的機能しているのはC重油価格で、東京電力が低硫黄C重油、王子製紙が高硫黄C重油のチャンピョン交渉を行います。トラック用軽油に関しては従前は西濃運輸の価格が有名でした。この並びで灯油に関しては日本最大の灯油需要家の消費者団体である札幌生協の価格が注目されていたわけです。
が、灯油や軽油に関しては、東京工業品取引所に先物市場が創設され、従来の大手企業や消費者団体が需給情報や市況情報を握って交渉するスタイルよりも、もっと透明な(と見える)価格決定メカニズムが確立されつつありますので、かつてほど注目されなくなりました。

生協というよりは札幌生協ですね。
「石油会社が生協の価格を基本として価格設定する」というよりは、「大手石油元売と札幌生協との交渉結果がそのシーズンの灯油価格の指標として注目される」というのが正しい表現だと思います。

そもそも石油業界にはチャンピョン交渉という考え方があり、大手供給者と大手需要家が業界を代表して、都度需給バランスや国際市況を反映した価格交渉を行い、他の供給者と需要者はその結果を自分たちの取引価格の参考とする習慣があります。
現在でも比較的機能しているのはC重...続きを読む

Qカーソルが画面端に来たとき横スクロールするhtml

ページ全体に画像を貼り、カーソルが画面の左右数センチに来たときに横にゆっくりスクロールされていくhtml(又はcss、スクリプト)を教えて下さい。
絵巻物を見るような感覚のページを作りたいと考えています。

また、その画像の上に、背景の上に付けるようにリンクを何箇所か乗せることは可能でしょうか?
可能でしたら、その方法も是非お聞きしたいです。
複雑な上に説明がわかりづらくて申し訳ありません。

Aベストアンサー

マウスのポイントで横スクロールはjqueryにあります。
 ⇒画像を使ったいろいろなjQueryプラグイン224個まとめ( 200+ collection of jQuery for images ) - かちびと.net( http://kachibito.net/web-design/224-image-jquery-collection.html )
画像の上にリンクを置くのは、単にナビゲーションのデザインです。
HTMLは、
<div class="nav">
 <ol>
  <li>
   <ol>
    <li><a href=""></a></li>
    <li><a href=""></a></li>
    <li><a href=""></a></li>
    <li><a href=""></a></li>
   </ol>
  </li>
  <li>
   <ol>
    <li><a href=""></a></li>
    <li><a href=""></a></li>
    <li><a href=""></a></li>
    <li><a href=""></a></li>
   </ol>
  </li>
・・・【中略】・・・
 </ol>
</div>
で良いです。HTMLさえ正しく書けていれば、どうにでもなりますよ。
 ⇒ナビゲーションリストを様々にデザインしてみよう。( http://www.ichiya.com/WebService/Howto/sample/HTML/nav/navigation1.html )
 にて、[表示]→[スタイルシート]→[画像の上に配置]がひとつの方法化と・・

マウスのポイントで横スクロールはjqueryにあります。
 ⇒画像を使ったいろいろなjQueryプラグイン224個まとめ( 200+ collection of jQuery for images ) - かちびと.net( http://kachibito.net/web-design/224-image-jquery-collection.html )
画像の上にリンクを置くのは、単にナビゲーションのデザインです。
HTMLは、
<div class="nav">
 <ol>
  <li>
   <ol>
    <li><a href=""></a></li>
    <li><a href=""></a></li>
    <li><a href=""></a></li>
    <li><a href=""></a></li>
...続きを読む

Q生協の仕組みがいまいち理解できません(×_×)

生協を利用されている方、多いと思います。
私も第2子の出産を機に、外に出るのが大変になってしまったので、利用を検討していました。

私の住む地域で生協を検索し、資料を請求したら、「資料を持って説明に伺います」と言われ、
担当の方が来ました。正直、営業に来たのだと思いました。資料だけでいいのにと。
が、どうせ加入するつもりだったので、その場で加入しました。
私に生協を勧めてくれた友達と話しているうちにわかったのですが、私の加入した生協は、
友達が利用している生協と、グループが違う??ようです。
(ちなみに私は東海、友達は関西です。)
生協ってたくさんあるのでしょうか。1つの会社と支部のようなイメージだったのですが。
調べてみると、私の住む地域で、生協が2つあることに気付きました。
片方はネットに情報が多く、いろんな活動をしていることがわかりました。
その生協は、友達が加入しているところと、同じグループのようです。
私の加入した生協を検索しても、情報が少なく、何だか不安になってきました。
出資金も違いました。近所でよく見かける生協のトラックは、私が加入したところの生協ではありません(泣)
そちらの生協の資料も請求してみました。大差ない感じもしますが、よく見ると、
商品のco-opのロゴが同じ!?です。あれ?という感じです。

ちなみに、引っ越して間もないので、近所に知り合いはいません。

生協は全部ロゴ(co-op)が同じなのでしょうか?
何箇所も生協がある意味は・・・?サンクスの近くにローソンがあって、
どちらも、じゃがりこを売ってる、というのと同じですか?←例えがおかしくてすみません。
どなたかわかりやすく教えて頂けないでしょうか・・・。

生協を利用されている方、多いと思います。
私も第2子の出産を機に、外に出るのが大変になってしまったので、利用を検討していました。

私の住む地域で生協を検索し、資料を請求したら、「資料を持って説明に伺います」と言われ、
担当の方が来ました。正直、営業に来たのだと思いました。資料だけでいいのにと。
が、どうせ加入するつもりだったので、その場で加入しました。
私に生協を勧めてくれた友達と話しているうちにわかったのですが、私の加入した生協は、
友達が利用している生協と、グループ...続きを読む

Aベストアンサー

生協は、法律により県をまたがることができないので、県ごとに存在します。
また、県内に複数あります。

県をまたげないので、グループを組んでいることもあります。
事業連合といった言い方をします。

生協はそれぞれに特色があり、それ故に県内に複数あるものです。
本来でしたら、それを比較して自分が利用したい生協を選ぶことになります。

もちろん複数加入することも可能ですし、その結果比較検討して脱退することも可能です。
(出資金は、入会金ではありません。生協への出資です。よって、脱退の際は返金されます)

ごく一般的な話ですべての県にあてはまるわけではありませんが、
規模が県内1位の生協は、規模を活かして価格が安めで買いやすく、お店も持っているところが多いです。
2位以降は、それぞれの特色(商品へのこだわりなど・・価格高め・個人宅配に注力など)を持っています。

首都圏の場合ですが、
規模1位のグループが、"コープネット事業連合"です。
コープとうきょう・さいたまコープなどが加盟しています。
http://www.coopnet.or.jp/
規模2位のグループが、"パルシステム生活協同組合連合会(旧首都圏コープ事業連合)"です。
http://www.pal.or.jp/

例えば愛知県でしたら、東海コープ事業連合(めいきん生協など)があります。

近接県とは同じグループの可能性はありますが、地域が違うとグループそのものも違います。

生協は、法律により県をまたがることができないので、県ごとに存在します。
また、県内に複数あります。

県をまたげないので、グループを組んでいることもあります。
事業連合といった言い方をします。

生協はそれぞれに特色があり、それ故に県内に複数あるものです。
本来でしたら、それを比較して自分が利用したい生協を選ぶことになります。

もちろん複数加入することも可能ですし、その結果比較検討して脱退することも可能です。
(出資金は、入会金ではありません。生協への出資です。よって、...続きを読む

QIE6で横スクロールバーを消すとIE7では方向キーでのスクロールができなくなります。直し方を教えてください。

ホームページでインラインフレームを使ってるんですが。

IE6だと無意味な所に横スクロールバーがでます。
調べるとoverflow-x: hidden;を追加すれば消えるとあったのでやってみると今度はIE7でキーボードの方向キーでのスクロールができなくなりました。

これはIE7の仕様なのでしょうか?
仕様なら直し方を教えていただきたいのです。

お願いします。

Aベストアンサー

今IEが手元にない環境から見ているので、実際の結果を検証できませんが…推測だけしてみます。

インラインフレームで表示される方のHTMLファイル(http://minatukiryu.blog60.fc2.com/index.php)(以下便宜上(a)ファイルとします)のコードと適用されているCSSを拝見しました。
おそらく、ですが(a)ファイルから参照しているCSS:
http://minatukiryu.blog60.fc2.com/template/a_memo_1/style.css
で、メインのコンテンツを納めるtableに対して設定されている以下のスタイルの
.tb {
(省略)
margin-left : auto;
margin-right : auto;
width : 100%;
(省略)
}
これらの部分がインラインフレーム側((以下便宜上(b)ファイルとします))に横スクロールを出させているのではないかと思います。本来、インラインフレームのwidth属性で820pxという値が決められており、インラインフレーム内のコンテンツ幅がそれより少なければスクロールに関しては初期値の"auto"が適用されますのでこの場合820pxの中での100%という様に解釈されていれば横スクロールは発生しない筈です。IE6以外のモダン・ブラウザではその様にきちんと表示されているのではありませんか?ちなみに今Safariで見ていますが、Safariでは横スクロールは出ていません。
IE6は何かとW3Cの仕様に準拠しない挙動をする問題の多いブラウザですので、本件でも100%や左右マージンの解釈が異なってしまい、インラインフレームの幅よりも内部で表示されるHTMLファイルのコンテンツ幅の方が広い様に勘違いしている為に、本来不要な筈の横スクロールバーが(b)ファイル上で出てしまっているのかもしれません。

(a)ファイルの構成を見る限り、上記の(IE6で不具合を引き起こす原因と仮定している)スタイル部分は削除してしまってもレイアウトにほぼ影響はしないと思われます。一度この部分を削除(あるいは隠す)して、再度IE6での表示を確認されてみてはいかがでしょう。

ちなみに、
> 調べるとoverflow-x: hidden;を追加すれば消えるとあったので

とありますが、そもそもoverflowプロパティというのは「ブロック要素の内容が指定された横幅・高さの領域からはみ出した場合の表示方法を指定」するものですので、"overflow-x: hidden;"が有効になるのは「widthプロパティにより内容領域を指定されたブロック要素が、指定されたサイズよりも内容が大きなサイズをもつ場合」です。
(参考)http://w3g.jp/css/display_position/overflow
今回の場合、(a)ファイルに適用されるCSSの中で
html, body {(省略)overflow-x: hidden;}
としてしまっていますが、これでは「どこがはみ出す対象となるのか」が明確になっておらず定義が意味不明になっています。IE7でキーボード操作によるスクロールに弊害が出てしまっているのは、この妥当でない指定が影響してしまっているのだと思われます。こちらは削除して下さい。

これでだめでしたらこちらの仮定違いということでご容赦下さい。

蛇足ですが、(b)ファイルの方、HTML文書なのにDOCTYPEがなかったり、HTMLとXHTMLの記述が混在してしまっています。CSSやJavaScriptの挙動には、DOCTYPEが関わってくる場合がありますので、この機会に(b)ファイル側のHTMLの文法チェックなどをきちんとしておく事をお奨めしておきます、今後の為に。

今IEが手元にない環境から見ているので、実際の結果を検証できませんが…推測だけしてみます。

インラインフレームで表示される方のHTMLファイル(http://minatukiryu.blog60.fc2.com/index.php)(以下便宜上(a)ファイルとします)のコードと適用されているCSSを拝見しました。
おそらく、ですが(a)ファイルから参照しているCSS:
http://minatukiryu.blog60.fc2.com/template/a_memo_1/style.css
で、メインのコンテンツを納めるtableに対して設定されている以下のスタイルの
.tb {
(省略)
margin-le...続きを読む

Q生協の使い勝手

今生協の勧誘を受けてるんですが、今までで生協と関わった事が無いので、良いモノなのか、悪いモノなのかも判りません。
生協経験者、もしくは元生協経験者の方にお聞きしたいのですが、生協の良い点、悪い点教えてください。
元経験者の方はなぜ辞められたのかも、差し支えなければ教えてください。

Aベストアンサー

 ウチでは近所にあったスーパーが倒産してこのかた生協に注文することが多くなっています。

 注文する品目としては惣菜やお肉など冷凍食品や要冷蔵のもの、お菓子類やバター、ソースなど、さらにティッシュ、トイレットペーパー、それにネコのキャットフードまで......とにかくなんでもかんでも状態です。

 別段品質が悪いといった感想もなく、賞味期限も問題なく、価格的にもさほど不満もなく、まして届けてくれる便利さもあるし、一度など包装が崩れていたクレームにもただちに対応してくれました。

 そんなわけで、なにかと利用度はかなり高いのですが、週一回の配達という点と、ちょっと高級品、ちょっとコダワリの商品などといったものでは満足度が低いので、駅前の大型スーパーやデパートまでクルマを走らせるということも適当に兼ね合わせています。

QLivedoorのような画面の横についてくる・・・。

Livedoorのホームページを見ていただけたら分かると思いますが、右横になにやらスクロールしてもついてくる物体があるのですが、これは一体どうやっているのでしょうか?http://www.livedoor.com/

HTMLでは出来ないですよね?

もしご存知の方がおられましたらアドバイスしていただけたら幸いです。

宜しくお願いいたします。

Aベストアンサー

まず、この招き猫を右クリック、プロパティで見ると
R000482702.gifという画像ファイルが正体である
ことがわかります。

次に、IE6でご覧なら、表示→ソースを表示させ、
R000482702.gif というキーワードを検索して
探してみてください。

すると、

<div id="adRight" style="position:absolute; display:none;">
<a href="http://・・略・・/loan/" target="_top">
<img src="http://image.・・略・・/R000482702.gif" width="60" height="80" border="0" alt=""></a></div>

とありますよね。

また、
<div id="adRight" とありますので、
adRight というキーワードを検索して
探してみてください。
下の方のjavascriptが効いているようですね。

こうやって、着眼したテクニックについて、
キーワードを追っていくと、
どのように実現しているかがわかります。

まず、この招き猫を右クリック、プロパティで見ると
R000482702.gifという画像ファイルが正体である
ことがわかります。

次に、IE6でご覧なら、表示→ソースを表示させ、
R000482702.gif というキーワードを検索して
探してみてください。

すると、

<div id="adRight" style="position:absolute; display:none;">
<a href="http://・・略・・/loan/" target="_top">
<img src="http://image.・・略・・/R000482702.gif" width="60" height="80" border="0" alt=""></a></div>

とありますよね。
...続きを読む

Q学生でなくても大学生協で申し込めば、予備校講座を生協価格で申し込めるのか?

いつもお世話になっております。
表題のままの質問です。

予備校講座は、予備校窓口や書店窓口で申し込むより、生協で申し込んだ方が数千円程安くなるのですが、すでに卒業してしまった後でも、(母校の)生協で申し込めば生協価格で申し込むことができるのでしょうか?
生協で申し込む際、学生証の提示など求めらますか?

御存知の方、教えてください。

Aベストアンサー

申し込める所も有れば、申し込めない所もある。です。

学校によって違いますので、母校で聞いてください。

Q横方向のスクロールをなくしたい

縦3分割(cols="*,700,*")のフレームにし、真ん中だけ遷移させるページを作成しているのですが、CSSで、

body{
overflow-x:hidden;
}

と設定しているのですが、横方向にスクロールされてしまいます。フレームの値(width)より真ん中のページに置く幅の値が等しいか同値であるのですが、何か設定が要るのでしょうか? 因みに縦はスクロールします。(真ん中のフレームのみ)
考えてみましたが、結論が出そうになかったので教えてください。お願いします。

Aベストアンサー

こんばんわ。


仮にこうフレーム設定したとすると。
<html>
<head>
<title>frameサンプル</title>
</head>
<frameset cols="*,700,*">
<frame src="sample1.html">
<frame src="sample2.html">
<frame src="sample3.html">
</frameset>
</html>

こんな感じで、真中のフレームページを<div>で囲ってみては如何でしょうか?
■sample2.html
<div style="width:660;overflow:hidden;">
<img src="test.jpg" width="800">
</div>

他に方法があるのかは分りません。


それでは。

Q生協のマーケティング

生協の宅配事業は、多くの主婦から支持を得ていますよね。そして、生協の宅配を利用する理由に、重いものを家まで届けてくれるから、安全だから、というのに並んで、冷凍で届けれられる半調理品が便利だから、ということがよく言われます(私もそのひとり)。

そこで不思議なのですが、生協はこういった独特のマーケティングをいかにして成功させてきたのでしょうか。スーパーの冷凍半調理品ってここまでの支持を得ていませんよね(気のせいでしょうか)。しかも、地域の生協が連合して、生協共通の商品を開発していたりもして。

生協が本来の役割からはずれ普通の小売化しているという批判もありますが、その是非は別として、売らんかなという側面が昨今強く出ているからかと思えます。

店舗では大手スーパーに負けているようですが、個配は伸びているだし。

どなたか生協のマーケティングについて、何か教えてくださいませんか。よろしくお願いします。

Aベストアンサー

info2005ですが、お礼ありがとうございます。
補足に対する補足ですが、

※やはりネーミングによる相乗効果というものが、うまくマッチしているのではないかと考えます。
これは発足依頼、偶然こうなったのか、既に予見
していたことかはわかりませんが。

1、特に生産者を巻き込むことができるのも、
  消費者の声をダイレクトに吸い上げるのも

  生活共同組合COOPという公共感が
  安心感や信頼性を一言で表現している。

  生産者の顔を見せるセールスプロモは最近
  一般の通販業者でも流行ってきております
  が、おそらく生協さんは多分ですよ、
  発足当時からリーセルバリューを抑えなけれ
  ばならなかったことから、直接
  農業産業に従事している方々をお客さんであり
  株主であり、取引先でありという土台を構築せざ  るを得なかったと考えます。これにて、マーケテ  ィング調査に必要な入り口と出口が同時に構築
  できてしまうと言う訳です。しかし、これが、
  当初から何とかホールディングスとか、何とか
  カンパニーとか言う昨今流行の名前だったら、
  固い庶民層で誰がスーッと信用してくれるのか?

  また、継続的な商品開発のもとになるマーケティ  ングは、やはり情報通信だけでなく、情報交換
  による現在のマーケティング手法と同じでは
  ないかと思います。もちろん、商品開発部も
  常にメディアやトレンドの研究も必死になって
  していると思う。住宅、保険分野もやっておりま  すが、その辺からの顧客庶民層のデータ交換も
  されているはず。つまり、ゆりかご~墓場まで
  すべて自分のターゲット層は把握しているから
  に他ならないと思います。

info2005ですが、お礼ありがとうございます。
補足に対する補足ですが、

※やはりネーミングによる相乗効果というものが、うまくマッチしているのではないかと考えます。
これは発足依頼、偶然こうなったのか、既に予見
していたことかはわかりませんが。

1、特に生産者を巻き込むことができるのも、
  消費者の声をダイレクトに吸い上げるのも

  生活共同組合COOPという公共感が
  安心感や信頼性を一言で表現している。

  生産者の顔を見せるセールスプロモは最近
  一般の通販...続きを読む

Q800*600の画面でもちゃんと見える横幅

ただ今新しいHPを製作中です。
参考がてらいろんな大手企業さんのHPを見回ってると大概
内容物が画面の真ん中(例:ホンダ技研)だったり左端(例:日産自動車)に寄っていて
ブラウザを小さくしても端が切れることなく読むことができるようになっています。
これはどうやっているのか教えて下さい><

あと、ウェブ定規で図ったところ各企業で幅が違うのですが(660px~720pxぐらいが多い)
この数字はどういった意図で決定されるのでしょうか。

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

Aベストアンサー

800x600を想定するならば、800x600pixで作れば良いのです。実際には、窓の枠がありますから、少し狭くなります。
「最大化してください」と書かれているページもむありますが、ブラウザによって画面の有効面積は違います。横に「お気に入り」とか出している人もいます。

画像中心の場合は、上記の点を考慮して、画像サイズを中心にレイアウトすることになるでしょう。中央に寄せて左右に均等に余白を作るには、スタイル使うのが本筋です。緻密に良く考えて作れれば良いのですが。実際には昔ながらのテーブル使ったレイアウトの方が多少詰めが甘くても崩れにくいです。ブラウザによる違いも少ないですし。

文字中心であれば、画面幅に合せて伸び縮みするような工夫が必要でしょう。No2の方のように、%指定するのが有効です。
文字サイズは、ユーザ側で変えられます。一定の幅にぴったりする文字数は違ってきます。スタイル等使って文字サイズを固定する方法もありますが、mozillaなどこの指示を無視する設定ができるブラウザもあります。小さな文字を指定されると困る人もいるからです。翻訳サイトやふりがなソフトなど使われると文字数自体が変ります。

絶対にやって欲しくないのは・・・ 強制的に窓のサイズを変えるサイト。画面の狭いパソコンにとっては、ブラクラ同然です。

参考URL:http://www.suita.ed.jp/edc/bunsho/hp/make_hp01.html

800x600を想定するならば、800x600pixで作れば良いのです。実際には、窓の枠がありますから、少し狭くなります。
「最大化してください」と書かれているページもむありますが、ブラウザによって画面の有効面積は違います。横に「お気に入り」とか出している人もいます。

画像中心の場合は、上記の点を考慮して、画像サイズを中心にレイアウトすることになるでしょう。中央に寄せて左右に均等に余白を作るには、スタイル使うのが本筋です。緻密に良く考えて作れれば良いのですが。実際には昔ながらのテーブル使...続きを読む


人気Q&Aランキング

おすすめ情報