• 締切済み

JavaScriptからCSSを呼び出す方法

現在、Noscript時とJavaScript稼働時の呼び出すCSSを分けるため、下記のような設定をしています。whole.cssからJavaScript稼働時のCSSをimportしています。 IE6エラー内容は「'framename' が宣言されていません」です。 記述 <link href="whole.css" rel="stylesheet" type="text/css" id="css"/> <script> framename.document.getElementById ('css').href = 'whole.css'; </script> JavaScript稼働時に呼び込む設定となっています。 IE6のエラー以外他ブラウザーは正常に表示されます。 よろしくお願いします。

みんなの回答

  • k0021
  • ベストアンサー率26% (32/120)
回答No.2

IE5.5・Safari・FirefoxをCSSを分けるため、下記URLを参考していますが。 まだ有りますが一部解像度によりCSSを分けていますが。 URL参考になると思いますが。 テーブル(罫線有り)を全てCSSで作成の場合は、Opera・Firefox・Ssfari(Google Chrome)・IEと全てCSSを分ける必要が有るよう用ですが >IE6エラー内容は「'framename' が宣言されていません」です。 IEのOpera・Firefox・Ssfariでは、JavaScriptのチェックは、していませんが

参考URL:
http://www.openspc2.org/reibun/javascript/browser/018/
pe_yanpe
質問者

お礼

回答ありがとうございます。参考になりました。 こんなに細かくブラウザ毎にCSSを分ける必要があるんですね。

  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.1

>IE6エラー内容は「'framename' が宣言されていません」です。 でも、正しく(?)表示されているのでは? >IE6のエラー以外他ブラウザーは正常に表示されます。 そうとは思えませんが… いきなり framename.document.~ で、「'framename' が宣言されていません」はその通りのエラーなので、IE6固有のものとは思えません。 他のブラウザの場合は、単にエラー表示が出ないだけなのではありませんか? やりたいことは  window.document.~  または  document.~  でいけるのでは? (同じCSSを適用していたのでは、切り替えのチェックができないのでは?)

pe_yanpe
質問者

お礼

申し訳ございません説明不足でした。 >IE6エラー内容は「'framename' が宣言されていません」です。 ページは正しく表示されています。 >IE6のエラー以外他ブラウザーは正常に表示されます。 おっしゃ通り、IE6固有のものと判断ができません。 他ブラウザではエラー表示が出てないだけのようです。 >window.document.~  または >document.~  でいけるのでは? 確認してみます。ありがとうございました。

pe_yanpe
質問者

補足

解答をくださった皆様ありがとうございます。 <link href="whole.css" にダミーを入れる事と、スクリプトタグの部分からframename.を削除で解決できました。 今後のともよろしくお願いします。

関連するQ&A

  • 引数を2個使いたい場合 Javascript

    こんにちは。 Javascriptについてアドバイスお願いします。 ■やりたいこと 「普通」「大きい」と言うテキスト画像をクリック することでCSSを入れ替える。 ・外部JSにしたい ・<input>のボタンではなく画像を使う ・一つのページで使うCSSは2種類(共通.cssと各頁ごとの設定用) 作ってみたスクリプトは下記の通りです。 function chooseCSS(csstype,cssname){ if(csstype == "normal"){ document.getElementById("baseCSS").href = "base.css"; document.getElementById("eachCSS").href = cssname + ".css";} else{ document.getElementById("baseCSS").href = "base2.css"; document.getElementById("eachCSS").href = cssname+"2.css";} } --------------------------------------------- HTMLの記述 ☆head内 <link href="base.css" rel="stylesheet" type="text/css"> <link href="base.css" rel="stylesheet" type="text/css" id="baseCSS"> <link href="top.css" rel="stylesheet" type="text/css"> <link href="top.css" rel="stylesheet" type="text/css" id="eachCSS"> ☆body内 <a href="javascript:void(0)" onClick="chooseCSS('normal','top')"><img src="img/btn01.gif" border="0" class="normal"></a> <a href="javascript:void(0)" onClick="chooseCSS('big','top')"><img src="img/btne02.gif" border="0" class="big"></a> --------------------------------------------- ローカルでは動いていたのでサーバーにUPしたらネスケとsafariは動作するのにIE(JSの設定は有効になっていました)だけ動かなくなりました。 あまりJavascriptは得意ではないので どなたかアドバイスお願いいたします!

  • javascriptにてcss切り替え

    現在webサイトを作成しており、javascriptのcss切り替えにてページの色変更を作っています。 (青、緑、赤、三色で作成) デフォは青で表示しています。 その後緑、赤とリンクで色が変わるようにしています。 ここでご質問です。 緑をクリックした場合は緑に変わる(赤も同様)のですが、別ページにリンクした場合、緑(赤)ではなく青に戻ってします。 別ページにとんでも緑(赤)が引き継がれるにはどのように記述したらよろしいでしょうか? ソースは以下のとおりです。 <head> <link rel="stylesheet" type="text/css" href="css/blue/top.css" media="all" /> <script src="js/styleswitch.js" type="text/javascript"></script> <link rel="alternate stylesheet" type="text/css" title="blue" href="css/blue/top.css" media="all" /> <link rel="alternate stylesheet" type="text/css" title="green" href="css/green/top.css" media="all" /> <link rel="alternate stylesheet" type="text/css" title="red" href="css/red/top.css" media="all" /> </head> <body> <div style="width:200px;"> <a href="javascript:chooseStyle('blue', 30)">青</a><br /> <a href="javascript:chooseStyle('green', 30)">緑</a><br /> <a href="javascript:chooseStyle('red', 30)">赤</a> </div> </body> javascriptは以下のところからしようしています。 http://noongoro.main.jp/note/note0059.html javascriptは初心者です。 ご教授お願いいたします。

  • 時間帯によって背景を切り替えるJavascriptとCSS

    時間帯によって背景を切り替えるJavascriptとCSSを作りたいのですが以下の書き方で良いのでしょうか?切り替わるには切り替わるのですが、時間の指定がうまくいってないようです。。 また下の3行はJavascriptをOFFにしているときはこのCSSという意味で良いですか? <SCRIPT LANGUAGE="JavaScript"> <!-- Begin function getCSS() { datetoday = new Date(); timenow=datetoday.getTime(); datetoday.setTime(timenow); thehour = datetoday.getHours(); if (thehour > 20) display = "includes/tree_twilight.css"; else if (thehour > 17) display = "includes/tree_sunset.css"; else if (thehour > 14) display = "includes/tree_afternoon.css"; else if (thehour > 11) display = "includes/tree_noon.css"; else if (thehour > 7) display = "includes/tree_morning.css"; else if (thehour > 4) display = "includes/tree_sunrise.css"; else if (thehour > 1) display = "includes/tree_twilight.css"; else display = "includes/tree_sunset.css"; var css = '<'; css+='link rel="stylesheet" href=' + display + ' \/'; css+='>'; document.write(css); // End --> } </script> <script language="javascript">getCSS();</script> <noscript> <link rel="stylesheet" href="includes/tree_sunset.css" type="text/css"/> </noscript> 宜しくお願いします。。

  • JavaScriptで、参照する階層を変えるとCSSが読み込めない

     ランダムに1.cssまたは2.cssというcssファイルを読み込むスクリプトを記述しています。 <script language="javascript"> <!-- var cssno = Math.floor(Math.random() * 2 + 1); document.write("<link rel='stylesheet' type='text/css' href='"+cssno+".css'>"); //--> </script>  これでうまく動いたので、このスクリプトを含むHTMLファイルがある階層に「css」というフォルダを作り、その中にcssファイルを移しました。そこで、 <script language="javascript"> <!-- var cssno = Math.floor(Math.random() * 2 + 1); document.write("<link rel='stylesheet' type='text/css' href='css/"+cssno+".css'>"); //--> </script> というふうに、変数cssnoの前に階層を表す「css/」をつけたのですが、これをやったとたんに動かなくなりました。  ファイルを同じ階層に移動させて、「css/」を取れば(=元の状態に戻せば)動きます。参照する階層を間違えているのかと思って、<head></head>内に通常通り<link rel~>でCSSを指定したら読み込めました。  スクリプトの記述方法がいけないんでしょうか? どうすれば、フォルダ「css」からcssファイルを読み込めるようになりますか?

  • css,javascriptの呼び出しについて

    某サイトで、 cssの呼び出しで <link rel="stylesheet" href="xxxx.css?v=yyyyyy" > javascriptの呼び出しで <script src="xxxx.js?v=yyyyyy"> という記述がされていました。 phpスクリプトではよく見かける?v=yyyyyyという記述ですが、cssとjavascriptでは見かけた事がないので色々と調べたのですが、答えが見つかりません。 上記に示した様な記述方法は一般的なものなのでしょうか? 取り留めのない質問ですがよろしくお願い致します。

    • ベストアンサー
    • CSS
  • noscript内にlinkは間違い?

    javascript初心者です。 javascriptが無効な場合に、 <noscript><link href="css/noscript.css" rel="stylesheet" type="text/css" /> ・・・・・・・・ </noscript> という形でcssを一部適用させているのですが、<noscript>のなかに<link>を書くのは文法上あまりよろしくないとのことで、ほかに正しい方法があれば教えてください。 よろしくお願いします。

  • 一部のページにデフォルトCSSを読み込ませない方法

    一部ページにCSSを読み込ませない方法がありましたら、 ご教授ください。 例えば、 全ページに以下のCSSを共通で読み込ませてあります。 <link rel="stylesheet" type="text/css" media="screen" href="css/common.css" /> <link rel="stylesheet" type="text/css" media="screen" href="css/index.css" /> しかし、test.htmlだけ <link rel="stylesheet" type="text/css" media="screen" href="css/index.css" /> を読み込ませたくありません。 つまり、 <link rel="stylesheet" type="text/css" media="screen" href="css/common.css" /> は通常通り読み込んで、 <link rel="stylesheet" type="text/css" media="screen" href="css/index.css" />のみを 除外したいです。 * 共通のCSSは外すことはできません。 * また、CSSを新たに追加することもできません。 * head内にスクリプトを記述することができますが、スクリプトの記述で解決できますでしょうか。 自分で検索もしてみたのですが、答えに辿りつけません。 どのような方法がありますでしょうか。 何か方法がありましたら、ご教授ください。 よろしくお願いいたします。

    • 締切済み
    • CSS
  • HTMLメールの外部CSSが有効になりません

    HTMLメールから以下のように外部CSS(http://から始めてます)を利用したいのですが、実際にOUTLOOK 2003 SP3で見るとスタイルが適用されていません。 ローカルで同じHTMLをブラウザで開くとスタイルは適用されます。HTMLメールのときは何か特別なことが必要なのでしょうか? <link href="http://domain/style.css" rel="stylesheet" type="text/css"> <link rel="stylesheet" href="http://domain/style2.css" type="text/css" media="screen" /> <script language="JavaScript1.2" src="http://domain/js.js" type="text/javascript"></script> ヘッダ全体を以下に掲載しておきます。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html><head> <title>TITLE</title> <link href="http://domain/style.css" rel="stylesheet" type="text/css"> <script language="JavaScript1.2" src="http://domain/js.js" type="text/javascript"></script> <link rel="stylesheet" href="http://domain/style2.css" type="text/css" media="screen" /> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head>

  • cssの振り分けについて

    下記のjavascriptの内容でわからないのでおしえてください。 if(cssFile){ if (document.getElementById && !opera5 && !opera6 && !(mac && ie5) && !icab){ var head = document.getElementsByTagName('HEAD').item(0); var newLink = document.createElement('LINK'); newLink.rel = "stylesheet"; newLink.type = "text/css"; newLink.href = cssFile; head.appendChild(newLink); }else{ document.open(); document.write('<link rel="stylesheet" href="' + cssFile + '" type="text/css">'); document.close(); } } よろしくお願いします。

  • javascriptでスクロール

    下記のhtmlソースでjavascriptでスクロールしてトップに戻るリンクを作ったんですが、WinのIEではスクリプトが効かずnoscript内の通常のアンカーが有効になってしまいます。 Firefoxではjavascriptの有効無効を判断して思った通りに動きます。WinIEでもjavascriptが有効のときはスクロールし、無効の時は通常のアンカーになるようにするにはどうすればいいのでしょうか? WinIEはセキュリティの設定でjavascriptを有効にしてあります。 <script language=javascript> <!-- document.write('<a href="javascript:pageup()">pagetop</a>'); //--> </script> <noscript> <a href="#pagetop">pagetop</a> </noscript>