• 締切済み

modalboxで表示したページでのcssについて

お世話になります、 modalboxで <a href="**.html" title="//..//" onclick="Modalbox.show(this.href,{title: this.title}); return false;">modalBox</a> で開いたページにCSSはきかないのでしょうか? 開くページを単体で見るとCSSを見てるみたいなのですが、 よろしくお願いいたします。

みんなの回答

  • yyr446
  • ベストアンサー率65% (870/1330)
回答No.1

modalboxのバージョンによって、呼び方が異なるみたいです・ modalbox.js Ver1.5.3までは Modalbox.show(ダイアログタイトル, 表示先URL) だそうです。

関連するQ&A

  • HPの文字の大きさを変えるCSSがうまくいきません

    ネット上によく出ているjsやcssを利用した文字サイズを変える方法を、ソースを取り込んでみるのですががうまくできません。 初心者なので、かわかり易く教えていただると助かります。 尚、styleswitcher.jsはダウンロード済です。 ソースは、 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Style-Type" content="text/css"> <link rel="stylesheet" type="text/css" href="style1.css" title="style1"> <link rel="alternate stylesheet" type="text/css" href="style2.css" title="style2"> <link rel="alternate stylesheet" type="text/css" href="style3.css" title="style3"> <script type="text/javascript" src="styleswitcher.js"></script> <style type="text/css"> style1.css body {font-size: 100%;} style2.css body {font-size: 80%;} style3.css body {font-size: 120%;} </style> <title></title> </head> <body> <a href="javascript:;" onclick="javascript:setActiveStyleSheet('style2'); return false;">サイズ小</a> <a href="javascript:;" onclick="javascript:setActiveStyleSheet('style1'); return false;">サイズ中</a> <a href="javascript:;" onclick="javascript:setActiveStyleSheet('style3'); return false;">サイズ大</a> <br> <br> テスト<br> </body> </html> よろしくお願いいたします。

    • ベストアンサー
    • HTML
  • javascripを利用したタブについて

    ご覧くださいましてありがとうございます。 http://okwave.jp/qa/q4800764.htmlのページの、yambejpさんがご回答されたタグ を使用させていただき、javascriptを利用した横並びのタブを作っております。 <p> <a href="#" class="selected" onclick="return ChangeTab(this,'tab1');">1111</a> <a href="#" onclick="return ChangeTab(this,'tab2');">2222</a> <a href="#" onclick="return ChangeTab(this,'tab3');">3333</a> <a href="#" onclick="return ChangeTab(this,'tab4');">4444</a> <a href="#" onclick="return ChangeTab(this,'tab5');">5555</a> </p> の部分の記述だけを、下記のように変更し、 <ul> <li><a href="#" class="selected" onclick="return ChangeTab(this,'tab1');">1111</a></li> <li><a href="#" onclick="return ChangeTab(this,'tab2');">2222</a></li> </ul> <li>をfloatで横並びにしています。 そして、選択中のタブの背景色(#000)をcssで設定しているのですが、2222をクリックしても1111のタブも選択中となってしまい、cssで設定している未選択状態の背景色(#fff)が適用されません。 どのような記述にしたら、2222を選択中に1111を未選択状態に出来ますでしょうか? 初心者で拙く分かりづらい質問になってしまい大変恐縮ですが、お知恵のある方がいらっしゃいまいたらご回答よろしくお願いいたします。

  • styleswitcherについて(ページ間での情報の維持)

    現在作成しているページで、CSSが切り替えられるstyleswitcherというJavaScriptを使用したいと考えていますが、別ページに移動した際に切り替えたCSSが元に戻ってしまって困っています。 環境は、 WindowsXP InternetExplorer6.0 です。 作成は、http://www.zakimi.com/archives/2004/06/05/214447.phpに書かれている通りに行いました。 具体的には、 ●jsフォルダにstyleswitcher.jsを作成 ●cssフォルダにdefault.cssと2.cssというCSSファイルを作成 ●<head></head>内に <script type="text/javascript"src="js/styleswitcher.js"></script> <link href="css/default.css" rel="stylesheet" type="text/css" title="default" /> <link href="css/2.css" rel="alternate stylesheet" type="text/css" title="2" /> と記述したhtmlファイルを2つ(AとB)を作成 ●htmlファイルAとBの<body></body>内に、それぞれ <a href="#" onclick="setActiveStyleSheet('default'); return false;">CSS1</a>&nbsp;<a href="#"onclick="setActiveStyleSheet('2'); return false;">CSS2</a> と記述 ●htmlファイルAとBに、それぞれのファイルへのリンクを作成 私が実現したいのは、htmlファイルAをブラウザで表示した後、『CSS2』をクリックしてCSSファイルを2.cssに切り替え、さらにファイルBへのリンクをクリックします。この時、ファイルBにはdefault.cssファイルではなく、2.cssを適用するというものです。 現状は、htmlファイルAでCSSをCSS2に切り替えた後にファイルBへ移動すると、default.cssファイルが適用されてしまいます。 これではページ間を移動するたびにCSS2に切り替えなくてはいけなくなってしまうので、困っています。 どなたかお分かりの方がいらっしゃいましたら、お知恵をおかしください。宜しくお願いいたします。

  • ポップアップ表示の後のreturn false

    onclickで小ウィンドウを出した後、元のページが最上部に戻らないようにするための処理として <a href="#" onclick="sWin('./popup.html'); return false; "> というように書いています。このreturn falseを 何とか全ての<a>タグ内に書かなくて済む様に、 sWin()関数の中に入れてしまうような方法はないでしょうか? return false; を関数の最後にそのまま書いてもダメでした。 よろしければご指導ください。m(_ _)m

  • リンクにおける挙動の参照と範囲指定

    ほぼ初心者です。 html内に、javascriptを参照させて、以下のように作成しました。 <SCRIPT language="javascript"src="popup.js"></script> <□□> <a href="1.jpg" onclick="popup(href);return false;">テスト1</a> <a href="2.jpg" onclick="popup(href);return false;">テスト2</a> <a href="3.jpg" onclick="popup(href);return false;">テスト3</a> </□□> 普通にポップアップされたのですが、以下の方法ができないかと思っております。 (1)「onclick="popup(href);return false;"」の部分をほかから参照させる (2)特定の範囲のリンクのみ「onclick="popup(href);return false;"」を適用させる。 (1)はLightboxのように、「rel="thumbnail"」みたいに参照できないか、ということです。 (2)は上の「<□□>~</□□>」のように囲われた範囲のリンクで、「onclick="popup(href);return false;"」を適用できないか、ということです。 よろしくお願いします。

  • お気に入りに追加された数とスタートページに追加された数を知りたいのですが

    以下の様なタグでお気に入りに追加 と スタートページTabに追加 の欄を作ったのですが、こちらでその数を把握したいと思っています。 スタートページ設定 ■□■□■□■□■□■□■□■□ <a href="#" onclick="javascript:this.style.behavior='url(#default#homepage)';this.setHomePage ('http://●●●');return false;">スタートページにする</a></center> お気に入りに追加 ■□■□■□■□■□■□■□■□ <INPUT type="button" value="お気に入りに追加" onClick="javascript:window.external.AddFavorite('http://●●●●/','●●●)"> 宜しく願いします。

  • 前のページに戻るとページトップに戻るの併用方法

    ホームページのページ内に前のページに戻るボタンとページトップ(同ページの最上部)に戻るボタンの両方をJavaScriptで設置したいのですが、方法がわかりません。 前のページに戻るは <a href="javascript:history.back()">戻る</a> としています。 ページトップ(同ページの最上部)に戻るは <a href="javascript:scrollTo(0,0);undefined;" onclick="return false;">ページトップに戻る</a> としています。 以上の両方を併用する方法を教えていただけないでしょうか? よろしくお願いします。

  • Javascriptがうまく動作しません。

    こんにちわ。 サイト制作初心者の者です。 サイトにCSSの切り替えが出来る"styleswitcher.js"を使用しているのですが、 切り替えの動作はするものの、ページを更新(リフレッシュ)したり、別のページに移動すると、元のCSSに戻されます。 ネットで同じ様なエラーが出てないか確かめてみましたが、役に立ちそうな答えが見つからなかったので、ここに質問させていただきます。 Styleswitcher.js http://www.alistapart.com/articles/alternate/ サイトでのソース: == <head></head>内:== <script type="text/javascript" src="js/styleswitcher.js"></script> <link rel="stylesheet" href="css/style.css" type="text/css" title="Default" /> <link rel="alternate stylesheet" href="css/style2.css" type="text/css" title="Custom2" /> <link rel="alternate stylesheet" href="css/style3.css" type="text/css" title="Custom3" /> == <body></body>内:== <div class="csspalette"> <a href="#" onclick="setActiveStyleSheet('Default'); return false;"><img src="images/ccss1.jpg" width="18" height="18" border="0" class="ccss-icon" /></a> <a href="#" onclick="setActiveStyleSheet('Custom2'); return false;"><img src="images/ccss2.jpg" width="18" height="18" border="0" class="ccss-icon" /></a> <a href="#" onclick="setActiveStyleSheet('Custom3'); return false;"><img src="images/ccss3.jpg" width="18" height="18" border="0" class="ccss-icon" /></a> </div> ==== コードには問題は無いと思うのですが、 この他にJquery等を使ったエフェクトを入れているので、それが問題なのでしょうか? ご教授願います。

  • 表示と非表示

    下のような物があったときに、1を押したときに1が現れるのですが、続けて2を押したときに1と2が表示されてしまいます。 この時に、2を押したら、1を非表示にして2だけを表示したいのですが、可能でしょうか? よろしくお願い致します。 <HTML><HEAD><TITLE>test</TITLE> <SCRIPT LANGUAGE="JavaScript"> <!-- function apper(sLayers) { if (document.all) { if (document.all(sLayers).style.display=='inline') {  document.all(sLayers).style.display='none'; } else { document.all(sLayers).style.display='inline'; } } return (false); } // --> </SCRIPT> <style type="text/css"> span.hidden { position: relative; display: none } span.visiable { position: relative; display: inline } // --> </style></HEAD> <BODY> <a href="" onClick="return apper('1')">質問1</a><br> <a href="" onClick="return apper('2')">質問2</a><br> <a href="" onClick="return apper('3')">質問3</a><br> <span class="hidden" id="1">1<br></span> <span class="hidden" id="2">2<br></span> <span class="hidden" id="3">3<br></span> </BODY></HTML>

  • 印刷曜CSSがどこかおかしい・・・非常に困っています。。。

    <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <title></title> <link rel="stylesheet" type="text/css" media="print" href="print.css"> <style type="text/css"> <!-- .style1 { font-family: "MS Pゴシック"; font-size: 12px;} --> <style type="text/css" media="print"> .print { display: "none" } </style> </style> </head> <body> <span class="style1"><p class="print"><p class="print2"><a onclick="window.print();return false;" href="#" >おおお</a></p></p></span> とソースに記載すると、「おおお」が印刷されないと思うのですが、なぜか、「おおお」が印刷されてしまいます。 どうすれば、「おおお」を印刷されなくなるのでしょうか?

    • ベストアンサー
    • HTML

専門家に質問してみよう