音量スライダーのJavaScriptが効かない?

このQ&Aのポイント
  • 動画を流すサイト作りに携わっています。音量を調節するスライダーをJavaScriptで付けてくれと依頼され、詳しくないためにつまづいています。IEではスライダーは動くが、FirefoxやMacのsafariでは動かない。
  • 上記のサンプルは<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">を使用しており、これならFirefoxでも問題なく動作する。しかし、実際にコーディングしているhtmlは<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">である。
  • JavaScriptの問題の可能性も考えられるが、他のソリューションを探すべきかどうか相談したい。
回答を見る
  • ベストアンサー

音量スライダーのJavaScriptが効かない?

質問させていただきます。 動画を流すサイト作りに携わっています。 私はデザインとコーディングまでが仕事なのですが(動画の実装は他社担当) 音量を調節するスライダーをJavaScriptで付けてくれと 依頼され、あまり詳しくないものでつまづいてます。 下記のように実装してほしいという担当者からの リクエストがあったのでやってみたのですが、IEではスライダーがちゃんと横に動かせるのですが、 FirefoxやMacのsafariなどではダメでした。 http://www.hajimeteno.ne.jp/dhtml/dist/js64.html 調べたところ、上のサンプルと実際にコーディングしているhtmlの文書型宣言が違うことが 原因のようなのです。<!DOCTYPE ~を削除すると意図した通りに動きます…。 上記サンプルでは<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">で、 これならFirefoxでも問題なく動いてます。 コーディング中のhtmlは <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">です。 JavaScriptではそういうことがあるのでしょうか? このJavaScriptを諦めて、他のものを探したほうがいいでしょうか? どなたか、お力をお貸しください! よろしくお願いします。

noname#196636
noname#196636

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

  • ベストアンサー
  • arexis
  • ベストアンサー率66% (66/99)
回答No.1

もちろんDOCTYPEで色々変る事はありますよ。 例えば document.all はIEにしか使え無いといわれていますが、 DOCTYPEを記述しない場合は、Firefoxでも理解できるケースがあります。(互換モード) ま、細かい所までチェックする時間がないのでとりあえずですが そのサンプルで XHTMLのDOCTYPEに変更してから 一塊の部分 document.getElementById("iLf").style.left = xmin + x + 'px'; document.getElementById("iLf").style.top = iniY + dY + 'px'; document.getElementById("iLb").style.left = iniX+ 'px'; document.getElementById("iLb").style.top = iniY+ 'px'; document.getElementById("iLv").style.left = iniX + valx+ 'px'; document.getElementById("iLv").style.top = iniY + valy+ 'px'; document.getElementById("iLv").innerHTML = iniValue+ 'px'; 下の方1箇所 document.getElementById("iLf").style.left = mmlayx+ 'px'; の様に getElementByIdを使ってる部分で + 'px' をポジション値のケツにつけてみて、目的どおりに動くか試してみてください。

noname#196636
質問者

お礼

お礼が遅くなりすみません。 やはり、DOCTYPEで変わることがあるのですね。 document.all がIEにしか使えないとも知りませんでした…。 まだ、教えていただいたものを試す時間がないのですが、 やってみます。 取り急ぎですが、ありがとうございました。

関連するQ&A

  • hp作成 Firefox javascript dreamweaver

    dreamweaverでHPを作成する時に <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> が入力されています。 この<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">が入力されているとFirefoxでjavascriptを表示できません。 Firefoxでjavascript表示したい時(DTD)はどのような表示が良いでしょうか?

  • 宣言文とjavascript

    javascriptでチップヘルプを表示させています。 文字にマウスが乗れば説明文が表示されるものです。 こちらの宣言文を <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 下記のもの <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> に変更すると、チップヘルプが上手く表示されません。 指定した位置より、かなり離れてしまいます。 ブラウザ別(IEとFirefox)で確認したところ、Firefoxでは表示もされないようになります。 こちらを解消する方法はあるのでしょうか?

  • xhtml1.0でのJavascriptの動作

    こちらのフローティングメニューをWEBサイトに導入します。 http://dynamicdrive.com/dynamicindex1/staticmenu.htm 導入するサイトのDOCTYPEは <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> である必要があります。(【1】とします) フローティングメニューを導入しましたが動作しませんでした。 対策としてDOCTYPEを以下にした場合、問題なく動作しました。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> (【2】とします) このフローティングメニューが 【1】:動作しない 【2】:動作する という両者の違いは、htmlとxhtmlの違いのほかに、 なにかあるのでしょうか。 また、【1】でも動作させるためにはどうしたらよいのでしょうか? ※【2】を試した理由は、 下記のサイトで似たようなものが導入されており、宣言がそのような記述になっていたからです。 http://www.nhncorp.jp/intro/company_info.html

  • DOCTYPE宣言は厳密に気にするべきか??

    現在WEBを独学で学んでおります。 そこでDOCTYPE宣言についていくつか疑問に思いました。 ひとつでもわかる方はご回答頂ければ幸いです。 1.<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> と、ソースの頭に記述しておいて <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> の内容で記述(XHTML 1.0 Transitionalで記述)することは可能ですか?? つまり、HTML 4.01 Transitionalを宣言して終了タグなど、XHTML 1.0 Transitionalの方式で書いても正確に表示されるかを知りたく思って おります。 2.DOCTYPE宣言を書いてないサイトが多く見受けられますが、 この場合はどのようにDOCTYPE宣言と捉えられるのでしょうか? また、この場合のデメリットとかはありますでしょうか?? 以上、わかる方いましたらよろしくお願いいたします。

    • ベストアンサー
    • HTML
  • XHTML 1.0 Transitional でインラインフレームの表示方法

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> でインラインフレームを表示する方法はありますか? 普段は <DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">のドキュメントタイプでサイトを作っているのですが、他の人に作ってもらったサイトが上記のタイプで作られていました。そのサイトにiframeを組み込みたいのですが、表示がされませんでした。そこで、HTML 4.01 のタイプに変更したところ、文字の大きさや高さなどが崩れてしまいます。何かよい方法がありましたら教えてください。宜しくお願いします。

    • ベストアンサー
    • HTML
  • DOCTYPE宣言を変更するとjavaが機能しない

    ミスティーネットさんの「JavaScript 活用編 ポップアップメニューの表示」 の サンプルを使ってみたのですが、 http://java.misty.ne.jp/popup_menu.html DOCTYPE宣言を <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> に変更すると、ポップアップが固定となり、同じところにしか表示されなくなります。 該当ページのサンプルは、XHTMLでは機能しないのでしょうか。 それとも、javascriptの記述をどこか変更すれば動くようになるのでしょうか。 詳しい方がおられましたら教えていただきたいのですが、よろしくお願いいたします。

  • DreamweaverのXHTMLとIEの関係

    現在作成しているサイト(ホームページビルダーで作ったもの)をDreamweaverでHTMLからXHTMLに変換しようと思い変換してみると 私のサイトはインラインフレームに情報を表示しているのですが、 文字がはみ出していないのにもかかわらず横スクロールバーがでてしまいます。 原因を突き止めようと色々していると、変換時に出てくる <!DOCTYPE html PUBLIC "-//W3C//DTD Xhtml 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> があると横スクロースバーがでることはわかりました。 しかし、これを消してしまうとDreamweaverがXHTMLとして認識してくれません。 <!DOCTYPE html PUBLIC "-//W3C//DTD Xhtml 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> を消さずに横スクロールバーを消す方法は無いでしょうか? ちなみにFireFoxでは横スクロースバーはでません。 IEのみでます。

  • firefox+xhtml+javascript

    お世話になっております。 divをweb上でドラッグできるスクリプトを組みました。 Opera9.6,IE6では動いているのですが、Firefoxでは、ある条件下でしか動きません。 ある条件とは、DOCTYPEの宣言がされていないことで、XHTMLにしようとDOCTYPEを宣言すると、動作しなくなってしまいます。 <?xml version='1.0' encoding='UTF-8'?> <!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.1//EN' 'http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd'> <html xmlns='http://www.w3.org/1999/xhtml' xml:lang='ja'> <head> <meta http-equiv='Content-Type' content='text/html; charset=UTF-8' /> <meta http-equiv='Content-Script-Type' content='text/javascript' /> <title>test</title> <script type='text/javascript' src='FILENAME.js'></script> -------- <!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.1//EN' 'http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd'> を消せば動きます。 仮に、DOCTYPEをHTML4.1などにしても動きません。 クオートをシングルからダブルにしても同じです。 動かない状態でも、JS自体は読んで、onload関数の中は見に行っているようです(alertを埋め込んだらでたので) 可能性として、 外部ファイルのJSの書き方に問題があるのでしょうか? それとも、HTML側に問題があるのでしょうか? ソースを見なくても何か考えられることがあれば、教えてください。 よろしくお願いします。

  • 外部JavaScriptのエラー

    外部JavaScriptのファイルを開くときに、「'document'は宣言されていません」と表示されてしまいます。 どうしたら解決できるでしょうか。 JavaScriptに関しては初心者です。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  "http://www.w3.org/TR/html4/loose.dtd"> 適用されるページはこのように宣言していますが、ここに問題があるのでしょうか。 回答お願いします。

  • ホームページビルダー10のバグ??

    勝手にhtmlを省略してしまい困っています。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> と書いて保存しもう一度見ると <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"> だけになってしまいます。百歩譲ってこれでもhtml適には 問題ないかと思うのですが勝手に省略させないようにする方法は ないでしょうか?

専門家に質問してみよう