• ベストアンサー

現在、CSS+HTMLでページを作りました。

現在、CSS+HTMLでページを作りました。 その中で、動画や音声を再生できるコーナーを作りたいのですが、 どういったものがあるのでしょうか? 希望としては、自動再生ができて、尚且つページ上部に音声のオンオフが出来るボタンを付けたいです。 ファイル形式はエンコードしてそのプレイヤーに合わせるとします。 なお、にこにこ動画やyou tubeなど、ページ外部にリンクするものは必要ありません。

  • HTML
  • 回答数3
  • ありがとう数2

質問者が選んだベストアンサー

  • ベストアンサー
回答No.2

スクリプトだけだとあまり現実的ではない気がしますが・・・ IE切ってもOKならhtml5でページを組んでvideoタグを利用されると良いんじゃないでしょうか。 まだブラウザの足並みが揃っていないのでH.264とOggの2種類のビデオフォーマットを用意する必要があります。 音声のオンオフ等はブラウザの標準機能で表示されるみたいですね。とりあえずchromeではOKでした。 参考になると思うのでリンク載せておきます。 http://journal.mycom.co.jp/news/2010/01/27/033/index.html

gekikaraou
質問者

補足

ありがとうございます。 なるべくたくさんお人に見てもらいたいページなので、IE使用は必須に近いんですよねー。 知識として覚えておきますー^^ ユーザーのブラウザが全部対応するにはまだまだ先なんでしょうねー>< とはいえ、有効なご回答アリガトウゴザイマス^^

その他の回答 (2)

回答No.3

FLVファイルなどFlash系にするとほとんどの人のPCにFlash Player が入っているのでいいと思います。

参考URL:
http://tmpgenc.pegasys-inc.com/ja/product/webflv.html
gekikaraou
質問者

補足

フラッシュには出来るのですが、プレイヤーとオンオフボタンを離れた位置に置きたいのです。 それを実現できる方法を探しています。

  • otaku37564
  • ベストアンサー率38% (1160/3007)
回答No.1

FLVにして、プレイヤーとともに貼り付ける プレイヤー自体に音量調節も再生ボタンもあるしスクリプトでオート再生に設定すれば良いが ページ開いたら音が出て動画が読み込まれるページはユーザー全体から好かれない ADOBE FLASHを買えば動画のエンコーディングなどのお膳立ては全部出来る。

gekikaraou
質問者

補足

どういったプレイヤーがページに貼り付けできるのでしょうか? また、自動再生のタグはどうなりますか? フラッシュ化は考えていません。 スクリプトだけで 音声・動画のオンオフボタンを作りたいです。 イメージは軽い音声をFLVで自動再生し、ページの上部の音声オンオフボタンで音を出したりとめたり出来るものです。 よろしくお願いします。

関連するQ&A

  • HTML外部参照CSSについて

    HTML外部参照CSSについて HTMLから外部CSSを読み込むrink relとCSSから外部CSSを読み込む@importがありますが、どちらのやり方のほうがいいのですか?

    • ベストアンサー
    • HTML
  • CSSでのページ構築について

    CSSでのページ構築について CSSでのサイト制作に挑戦しています。 まずは、テンプレートをつかってカスタマイズしてみようとおもい、テンプレートをDLしました。 「フッタ/左メニュー/メインコンテンツ/フッタ」というブログなどでよくあるものです。 (縦三段で、真ん中が左右2つに別れている2カラム) CSSファイルは、外部読み込み形式です。 トップページを作って、いざメニューからメインページのリンクを貼ろうと思ってつまずきました。 左ページのコンテンツメニューに設定したリンクを、右側の枠内に表示したいのですが、そういった場合は、どうすれよいでしょうか。普通に右側の内容をいれたHTMLにリンクすると、全画面がそのページになってしまって、ヘッダ/左メニュー/フッタは消えて(隠れて)しまいます。 ヘッダや左メニューをそのままにしてページ数を増やしたいときは、トップページをひたすらコピーして、右側の要素部分だけを変更していくのでしょうか? でも、それだとCSSにする意味がないというか、全然楽ではないですよね。 左メニューの項目が増えた時など、全ページを修正しなければならなくなりますし。 自分なりにCSS関連のサイトを検索して調べてみたのですが、どこも「トップページをそのままコピーしているようにしかみえない」のです。 右側ページ内容のHTMLに、ヘッダやメニューも読み込ませるような設定が必要なのでしょうか? ソフトはDW CS4を使っています。 どなたか、CSSの達人さま、教えてくださいませ。 お願い致します。

  • HTML+フレーム構成のページを、HTML+CSSで書き換えるには?

    HTML+フレーム構成のページを、HTML+CSSで書き換えるには? コンテンツはそのままに、HTML+フレーム構成のページを、HTML+CSSで書き換えることになりました。 ヘッダー、フッター、上部に画像ロゴ、左にメニューを配置したいと思ってます。 メインコンテンツ部分以外はSSIでインクルードしたいと思っています。 案外簡単だと思ったのですが・・・すぐ配置が崩れて悩んでます。 さらに、CromeとIEで確認をするたびに配置が違ってしまいます。 merginとpadsdingを0にしてから始めるらしいことまでは調べたのですが、 そうするととても配置が変で面倒になります。 現在はFFFTPと秀丸とブラウザで作業してます。 ほかに、PhotoShop6とホームページビルダー14とMicrosoftExpressionweb3は手元にライセンスがあります。 HTMLは分かりますが、CSSは初めてです。多少がんばれば、javaScriptも使えるかもしれません。 お薦めの本や、作り方、フリーウェアなどありましたらご指導ください。よろしくお願いいたします。

    • ベストアンサー
    • HTML
  • 外部CSSが反映されるHTMLとされないHTML

    レンタルサーバのファイルマネージャを使ってサイトを作っています。 外部CSSで文字のフォントをMS Pゴシックに統一したいのですが、反映されるページとされないページができました。 CSSには、 @charset "Shift_JIS"; p { font-family: "MS Pゴシック",sans-serif; } 読み込みには、 <link href="./style.css" rel="stylesheet" type="text/css"> と記述しました。 反映されたのはサイト2ページ目の2分割フレームの片側だけで、その他のページはブラウザで指定したフォントのままCSSが反映しません。 HTML、CSS共に文字コードはShift_JISで統一していて、それぞれ<head></head>間の同じ位置に記述してあります。 反映されたHTML内にはボックスの幅指定でCSSを使っていますが、その他のページにはCSSを使っていません。違いはこれだと思うのですが、それがきっかけで反映されたりされなかったりと変わるものなのでしょうか? HTML、CSS共に初心者です。この質問が初歩的なことなのか難しいことなのかもわかりません。 よろしくお願いします。

  • 外部CSSが読み込めません/HTML

    HTMLにおいて、外部CSSを読み込めず困っております。 ググって対処法を実践しても一切反映されません。 現在下記のisaraというサイトを模写しております。 https://isara.life/ HTMLにおいて linkタグでCSSファイルを読み込んだのですがCSSが一切反映されず困っております。 HTMLとCSSファイルは同一フォルダ内にあります。 HTMLファイル名:isaramosya.html CSSファイル名:isaramosya.css HTMLの記述 <link rel=”stylesheet” href="isaramosya.css"> いくらググっても原因がわからず困っております。 原因思い当たる方いらっしゃいましたらお答えいただけましたら幸いです。

    • ベストアンサー
    • CSS
  • 簡素化したHTMLを書けるようCSSを勉強中です

    出来るだけ簡素化したHTMLを書けるよう、CSSを勉強中なのですが、今はドリームウィーバーのCS5.5なのですが、ホームページビルダーでホームページ作りを勉強し始めたため、どうしてもホームページビルダーの癖が出てしまいますし、CSSの云わんとするところは理解出来るのですが、「じゃあ具体的にどうしたらいいの?!」ってなってしまいます。 具体的には、HTMLだけで、TABLEを多重化させ書いていたページを、見た目を変えずに、TABLEを使わずに、HTML(出来ればXHTML)+CSS(外部ファイル)でweb2.0で書くとどうなるかとか、 画像のロールオーバーを≪<body onload=≫で書いていたのを同じくHTML(出来ればXHTML)+CSS(外部ファイル)で書くとどうなるかとか、比較してあると「私は」分かりやすいのですが、そういうサイトをなかなか探し出せないでいます。 こういう事を比較して書いてあるサイトがありましたら、教えて頂きたいです。 また、検索エンジン最適化(Search Engine Optimization、SEO)にもCSSは有効だという事ですが、≪<meta name="Keywords" content=≫等は、HTMLファイルに書くか、CSSファイルに書いた方が良いのか、CSSに書くなら書き方は同じで良いのか等、分からない事だらけです。 よろしくお願いします。

    • 締切済み
    • CSS
  • PHPとHTMLとCSSの関係性について

    PHP初心者です。 PHPとHTMLとCSSの関係性について教えてください。 今回、サイトをHTMLからPHP化しようと思っています。 (サイト管理が楽になると思ったため) 今作ってあるサイトは、外部CSS+XHTMLで作成していますが、 そのHTML内に <? include"../../side.html";?> とPHPの実行を記述した場合、 別ページとして用意した ../../side.html は外部CSSにデザインが左右されるのでしょうか? それとも ../../side.html の中でデザインを全て記述しなければいけないのでしょうか? こういう基本的過ぎる内容はどこのサイトにも初心者でも分かるように詳しくは書いてありませんでした。 よろしくお願いします。 ---------------- 48時間ぶっ続けで、色々調べてみました。 そして、PHPはサーバー側での処理でHTMLを吐き出すらしい、といことがわかりました。 (確認作業で自己PCをサーバーにするとかの必要も...) CSSとHTMLは確かブラウザ側での処理ですよね? 違っていたら教えてください。 もしそうなら、 普通に1ページの外部CSS+HTMLを作る→PHPで切り張りする これだけで、あとは切り取ったページの更新だけで全ページに更新を表示できるし、PHPって便利だなーと思います。 基本的な事が全く分かっていないおバカさんですが、よろしくお願いします。

  • 外部CSSで作成したページの印刷について

    「外部CSS」で作成したページを、印刷プレビューしてみると 「HTML」だけ?の状態のような感じです。 「外部CSS」で作成したページを、CSSが反映した見た通りには、印刷できないのでしょうか? なにか、記述の追加をすれば、できるのでしょうか? または、参考サイトがあれば、教えてください。 よろしくお願いいたします。

    • ベストアンサー
    • HTML
  • CSSの外部ファイルの作り方

    こんにちは、いつもはサイトのデザインをCSSで設定する時 HTMLファイルの<HEAD></HEAD>部分に書き込んでるのですが それらの量が段々多くなってきたので前ページ共通のCSSは外部ファイルでリンクさせようと思いました。 でも外部ファイルでCSSを作るのは初めてなので何分書き方などで少し分からないところがあります。 例えば1.文字の大きさ2.リンク下線消し3.行間の幅 などを指定する時これら全部を一つのCSSファイルに書いていいのですか? それとも一つのファイルには一つの設定しか書けないんでしょうか? あと、外部ファイルの場合<STYL>でまとめなくてもいいらしいのですが、もし一つのファイルに複数の設定を書けるなら その場合は一行あけて書いたりするのでしょうか? そして、これらCSSの外部ファイルにリンクさせたHTMLファイルの <HEAD>部分に後から他のCSSを書き込んでもそれは反映されますか? いろいろ多くて少し分かりづらい説明かもしれませんがお願いします。

    • ベストアンサー
    • HTML
  • CSSがHTMLに反映しない

    CSSをはじめて使う者です。XPでIEを使っています。 解説サイトの最も簡単そうなプログラムをコピペし、 HTMLファイルと外部CSSファイルを同じフォルダ(デスクトップにあるtopフォルダ) に入れてHTMLを開いたのですが、CSSを全く読み込まず、HTMLのテキストしか表示されません。 ★HTMLデータ(top.html) ------------------------ <HTML> <HEAD> <link rel=stylesheet type="text/css" href="C:\Documents and Settings\Administrator\デスクトップ\top\top.css"> </HEAD> <BODY> <div class="selecter">文字が赤くなり、左に5pxの罫線が引かれます。</div> </BODY> </HTML> ★CSSデータ(top.css) ------------------------ .selecter { color:#ff0000; border-left:solid 5px #ff9900; } ・他のサイトにはHTMLファイルのstylesheetに""があったので付けてみたのですが、意味なしでした。 ・他のサイトの形が異なるCSSも試したのですが同様の状態だったので、HTMLのHEADの部分が怪しいと思い、ファイル名指定を"top.css"に変えたりしたのですが、意味なしでした。 ・CSSは最初メモ帳で書いたのですが、拡張子がどうしてもCSSになってくれなかった(top.css.txtになる)ので、ワードパッドで書いて保存したら、拡張子は正常にCSSになりました。ただ何故かアイコンが、プログラムが見つからない時に表示される奴になっています…。 スタート地点から躓いていて非常に恐縮なのですが、何卒よろしくお願いいたします。

専門家に質問してみよう