![]()
- 複数枚画像を表示して一定時間で切り替える方法
画像を表示して一定時間で切り替える方法は別ページに記載されているものをみて出来たのですが、最初に複数枚表示してて、その画像を定時間で切り替えたいのですがご教授願います。 以下別質問で見つけたもの <!-- これを画像を張りたい位置に挿入。<body>～</body>内 --> <script type="text/javascript"> /* 設定部分 */ var interval = 3000; //切り替わる時間（1000=1秒） var imgs = new Array(); var hrefs = new Array(); imgs[0] = new Image(); imgs[0].src = "http://www.xxxxx.net/images/img-main/pake/013.jpg"; hrefs[0] = "http://www.xxxxx.net/moviepages/130923_707_01/index.html"; imgs[1] = new Image(); imgs[1].src = "http://www.xxxxx.net/images/img-main/pake/014.jpg"; hrefs[1] = "http://www.xxxxx.net/moviepages/130906_701_01/index.html"; imgs[2] = new Image(); imgs[2].src = "http://www.xxxxx.net/images/img-main/pake/015.jpg"; hrefs[2] = "http://www.xxxxx.net/moviepages/130830_698_01/index.html"; /* プログラム部分 */ var num = Math.floor(Math.random()*imgs.length); document.write('<a href="'+hrefs[num]+'" id="cth"><img src="'+imgs[num].src+'" id="cti" style="border:0" /></a>'); var cti = document.getElementById("cti"); var cth = document.getElementById("cth"); setInterval(function(){ num += Math.floor(Math.random()*(imgs.length-1))+1; if(num>=imgs.length) num -= imgs.length; cti.src = imgs[num].src; cth.href = hrefs[num]; },interval); </script> <!-- ここまで --> script初心者でよくわかりません＞＜
- 締切済み
- JavaScript
- pawoonpawoon
- 回答数3
- 横スクロールを縦スクロールに変換したい
ちょっと違うのですが、こちらのサイトをご覧ください。 http://www.rinkokikuchi.com/# このサイトでは横スクロールデザインですが、マウスの縦スクロールをしても横にスクロールできるようになっています。 私が今困っているのはパララックスを使った縦スクロールのサイトを作っているのですが、 マウスのホイールを横にスクロールした際にもサイトを縦にスクロールできる様にしたいのですが、分かりません。 縦横どちらでもスクロールできる様にしたいです。 どなたか教えて頂けませんでしょうか。
- 締切済み
- CSS
- sarutorusa
- 回答数1
- HTMLでＣなどのソースを載せるときに
お世話になります。 Webページに、Ｃ言語などのサンプルコードを 載せたい場合、<pre>タグなどを使わずに、きれいに タブスペースやインデントを表現できる方法は ありませんでしょうか。 通常に載せただけでは、タブ文字や半角スペースは 表示されませんし、だからといって & nbsp;などの連続で インデントを表現するのもあまりカッコよくありません。 たいていは<pre>タグを使用されているのが多いのですが、 やはり非推奨なので、できれば使用したくありません。 具体的な方法がありましたら、お教え願えないでしょうか。 よろしくお願いします。
- ベストアンサー
- HTML
- tatapatank
- 回答数4
- W3C CSS検証サービスのエラー箇所を修正したい
お世話になります。 YUI（Yahoo! UI Library）のReset CSSをW3CのCSS検証サービスでエラーが出ないように修正をしています。 試行錯誤を繰り返し、いくつかあったエラー・警告は修正できたのですが、 input, textarea, select { *font-size:100%; } 上記の部分のみエラーが出てしまいます。この部分の記述を input, textarea, select { font-size:100%; } 上記のように*を外すとエラーが出なくなるのですが、*があるのとないのではどのような違いがあるのか？*を外した場合、リセットCSSとしての本来の役割（ブラウザごとの初期値の違いをリセットする）を果たす上で問題が出ないのかどうか？という事が、イマイチわかりません。 仮に*を外した場合、リセットCSSとしての役割を果たす上で何か問題が出るのであれば、どのような問題が出るのか？また、その場合、どのように修正すればリセットCSSとしての本来の役割を果たしつつ、W3CのCSS検証サービスでエラーが出ないように出来るかご教授頂ければ幸いでございます。 よろしくお願いいたします。
- IE9なのにIE7と判別される
jsにてユーザーエージェント判別をして、 各ブラウザを判別し、bodyに各々のクラスをつけるようにしています。 IEのバージョンを調べるために、 if (appVersion.indexOf("msie 6.0") > -1) { $('body').addClass('ie6'); } このように書き、バージョンを判別しているのですが、、、 なぜかIE9でみているのにも関わらずIE7になってしまっています。。。 しかし違うパソコンで見るときちんとIE9になっているんですね。 何が原因なのでしょうか。 このようなことが起きるのであれば、 IEのバージョンの判別は辞めた方がよいのかなーとも思っています。 実際このようなことがユーザーの中で起こりうる可能性があるのならば、 IE9で崩れる原因になりかねないと思いましたので。。。 もし何か分かる方がいらっしゃったらご教示いただければ幸いです。 どうぞ宜しくお願い致します。
- 木材の種類やサイズの豊富なホームセンター
木材の種類やサイズが豊富なホームセンターを探しています。 カインズホームの町田多摩境店資材館がいいようですが、埼玉県や東京都区内に 同じような規模がありませんか。
- 締切済み
- DIY(日曜大工)
- 7MissShots
- 回答数3
- IE用と、その他のCSSを条件分岐
お世話になっています。 IE用と、その他のCSSを条件分岐させるために 以下の用にやったのですが その他のfirefoxなどもIE用（wholerulesie）のスタイルシートになってしまいます。 どこが悪いのでしょうか？ <link rel="stylesheet" type="text/css" href="wholerules.css" /> <!–[if IE 8]> <link rel="stylesheet" type="text/css" href="wholerulesie.css" /> <![endif]–>
- １つのリンクで２つのフレームに別々の情報を表示
現在、ｈｔｍｌで小説のＨＰを作成しています。 こういうことはできるのかな？と思いついたことがあったのですが、 できるのでしょうか。 【hogehoge】というリンクをクリックしたら、 フレーム(1)に小説のタイトルを表示し、フレーム(2)に本文を表示したいのです。 そういうことってできますか？ ググってみたりもしたのですが、検索語句がイマイチ分からないため、 これだという情報が見つからないので、ここへ質問をしました。 よろしくおねがいします。
- 締切済み
- HTML
- rokomokoxx
- 回答数3
- 背景について・・・
いつもお世話になっております。 今添付画像のようなサイトを付くろうと思っております。 http://snapkidz.biz/wp/ 今回うまくいってない部分は、背景です。 firefoxでみると崩れなどはないのですが、ipadでみるとかなりheadとmainの部分に隙間がうまれてしまいます。 この背景のひき方は間違っているんでしょうか？ html/ [header] <body> <div id="page"> <div id="wrapper"> <div class="header"> <h1><a href="#"><img src="http://snapkidz.biz/wp/wp-content/uploads/2011/12/logo_03.gif" width="171" height="76" alt="Art・・"></a></h1> </div> [フッダー部分にpageとwrapperの/divの記載はあります。] [CSS] html,body{margin:0;padding:0;} #page{height:580px;background:url(http://snapkidz.biz/wp/wp-content/uploads/2011/12/theme_top_01.jpg);background-repeat:no-repeat;margin:0 auto;background-position:center;padding-top:10px;} #wrapper{width:100%;margin:0 auto;} .header{width:980px;height:100px;margin:0 auto;} .header h1{margin:0;} #main{height:1317px;background:url(http://snapkidz.biz/wp/wp-content/uploads/2011/12/body_02.jpg);background-repeat:no-repeat;margin:0 auto;background-position:center;position:relative;top:450px;} こっちのほうが楽だよ！とか普通はこうだ！などありましたら勉強不足な自分に教えてください。 宜しくお願いします。
- WEB上でディレクトリ内の画像を一括表示
自分のWEBサイトで特定のディレクトリに保存されている100枚近くある画像を一括で表示させたいのですが良い方法はないでしょうか？ 現在、 <a src="画像パス"><img src="画像パス" width=サムネイル程度の大きさ(240)></a><br> のような感じで手打ちで100枚分書いています。 ・画像は今後追加・削除していく可能性がある ・画像の拡張子、サイズ、ファイル名は統一されていない ・画像ファイルは特定された一つのフォルダにまとまって保存されている 今後大量の画像が追加されるたびにHTMLでタグを打つのが面倒なので自動化できればいいなと思うのですがどうしたら良いか分からず皆様のお知恵を貸して頂けると幸いです。 当方のWEBサーバではjavascriptとPHPの動作確認は済ませています。 javascriptやPHPを使って特定のディレクトリ内のファイルリストを取得し、それに合わせて画像を表示するコードを吐ければ良いのですが、素人なので何からやればいいのかさっぱりわからない状況です。 よろしくお願いします。
- IE6,IE7でボックスがずれてる。解決法を願いし
こんにちは、Santaと申します。 いつもお世話になっております。 さて、ホームページを製作しております。 ブラウザプレビューには、 Chrome 16.0 Firefox 8.0.1 IE9 ソフト Microsoft Expression SuperPreview 4 Trial を使用しまして IE6 IE7 IE8 IE9 Firefox3.6 を確認しておりますが、IE6とIE7のみ、ボックスがずれてしまいます。 どのようにしましたたら、解決できますでしょうか？ html（複雑に作ってしまいましたので、簡単に書かせて下さい） ******************************************* <div id="wrapper"> <div id="header> Rと書いてある画像が入っているボックスです </div> <div id="line"> 直ぐ下の、１０pxの横長の950pxの黒いラインです。 </div> <div id="contents"> こちらに５つのDIVボックスが入っております。 ●左の赤いwidth:75px height:500px;のものが一つ目のDIVボックスです。 </div> </div> 簡単に書きました。 画像のとおり、<div id="line"></div>に入っている width:950; height:10px; の黒のラインが少し下がってしまい、赤色の部分と重なってしまっております。 赤色の部分が上がっているのではなく、上の横長の黒のラインが下がっているようです。 何か解決法が御座いますでしょうか？ どうぞ、よろしくお願い致します。 失礼致します。
- 使われていないスタイルシートの掃除の仕方
webサイトのメンテナンスで使われていないであろうスタイルシートが 多くなってきたのですが、みなさんどうされていますか？ お勧めのツール等ご存じでしたら教えて頂きたいです。
- 締切済み
- CSS
- hamburger_hill
- 回答数2
- CSS段組み？で右カラムを右寄せにするには？
説明が難しいのですが・・・ テーブルレイアウトでいえば、下記のHTMLで実現できるような表示方法を、 tableタグを使わずに実現したいです。 <table style="width: 100%;"><tr> <td>左パーツ</td> <td style="text-align: right;">右パーツ</td> </tr></table> divタグに float: left; を付けると、２つのdivブロックを横並びに配置できますが、 右側にあるdivにtext-align: right;を付けても、左寄せになってしまいます。 ※width未指定なので当たり前なのですが・・・ ただ、今回の場合は実際にマルチカラムを実現したいわけではなく、 上記コードでいうところの左パーツを画面の左端へ、 そして右パーツを画面の右端に表示させたいだけです。 左右それぞれの横幅は特定していません。 どなたか分かる方、教えて下さい。
- ホームページの背景画像をパソコン画面に合わせたい
ホームページを閲覧しに来るユーザーに見せる背景画像をパソコンの画面の大きさに合わせて、画面枠と背景画像の大きさを揃えたいのですが、どのようなタグにすればいいのかわかりません。 1024×768ピクセルの画面でも 1280×1024ピクセルの画面でも 1920×1200ピクセルの画面でも 同じような背景画像として映るようにしたいです。縦と横の画像の比率は多少変化しても構いません。 どうか、ソースの記述をお願い申し上げます。お手数かけて誠に申し訳ありません。どうか、どうか、ご教授願います。
- DIVの崩れを防ぐには
図のように<div>で段組を作った場合、このままだとウィンドウの幅を狭めた時に、 CのブロックがBの下に回りこんでしまうと思うのですが、 これを防ぎたい場合はやはりA・B・CもしくはB・Cをさらにブロックで囲うしか 方法はないでしょうか？
- 背景画像の動的拡縮
要素の背景に指定した画像の拡縮について質問させてください。 div { background-image: url("ohana.png"); } の様にする事でdiv要素の背景画像を指定できますが、 div要素のサイズが不定(内容やクライアントの設定によって変動)である場合、 画像が途中で切れたり繰り返し表示されたりせずに、 要素に合わせて適切なサイズに拡縮して表示させたいと考えています。 これを実現する場合、どのように指定すればよろしいでしょうか？ IEのみの独自仕様を利用した実装は回避し、 IE6～とFF3.6～で実現できればと考えています。 宜しくお願い致します。
- 締切済み
- CSS
- mamadorusu
- 回答数4
- DIVの崩れを防ぐには
図のように<div>で段組を作った場合、このままだとウィンドウの幅を狭めた時に、 CのブロックがBの下に回りこんでしまうと思うのですが、 これを防ぎたい場合はやはりA・B・CもしくはB・Cをさらにブロックで囲うしか 方法はないでしょうか？
- テーブルを使わずにコーディングをしたい
添付の画像のようなページを テーブルを使わずdivだけで作成することは 可能でしょうか？ 青のしかく、黄色のしかくなどは 一枚の画像として背景で指定して プルダウンのタブをそれぞれの四角の 下に配置したいのですが 場所もバラバラなので困っています。 position：absolute； などを使っても、 サイトのCSSが複雑で どこかでposition：relative；を使っているようで 位置がブラウザによって変わってしまったり 全画面表示の時の位置と 縮小した画面の時では場所が全然違います。 何か方法をご存知の方いらっしゃいましたら 教えていただけないでしょうか。 よろしくお願いいたします。
- ベストアンサー
- CSS
- eri0055896
- 回答数4
- 画面サイズを取得し、テーブルの高さ、幅を指定したい
以下のような方法で、画面に合わせたテーブルを作成したいのですが、 うまくいきません。 幅の変数を単にタグ属性の値にしても動かない事が判りました。 どのようにしたら、値をセットできるのでしょうか。 ご存知の型がおられましたら教えてください。 よろしくお願い致します。 <html> <head> <title>ウィンドウサイズを取得する</title> </head> <body> <script Language="JavaScript"><!-- w = window.outerWidth; h = window.outerHeight; // --></script> <table width="w" height="h"> <tr> <td> test </td> </tr> </table> </body> </html>
- ベストアンサー
- HTML
- hatokamome
- 回答数3