バックグラウンド：
Intuit Web Designs を使用して Web サイトを作成しています。私の意見では、彼らは次のような非常に奇妙な HTML セットアップを持っています。Intuit では、HTML ボックスを追加できます (HTML コードを貼り付けるため)。<head></head>ただし、このサイトでは、ページの横にある別のボックスにタグ内に何かを貼り付ける必要があります.
私がやろうとしていること: 完全に機能する 2 つの jQuery スクリプトがあり、それぞれが別々のドキュメントに書かれています。1 つのドキュメントから HTML を Intuit 内の HTML ツールにアップロードしました。次に、jQuery スクリプトを Intuit 内の特別な見出しボックスにアップロードしました。すべてが完璧に機能しました。
両方のドキュメントを同じページで実行したかったので、今度は 2 番目のドキュメント (もう一度 HTML と jQuery) を追加します。HTML は正常にアップロードされましたが、2 番目の jQuery スクリプトを最初の jQuery スクリプトに結合するとすぐに、Chrome コンソールは、JQuery スクリプト #1 にファイルがないことを通知し始めます (2 番目のスクリプトを追加する前に機能していたので不可能です!) . 結論から言うと、2 つ目のスクリプトを追加したことで、何かがおかしくなったようです。
これが私の2つのドキュメントです（完全なコードが含まれています）：
ドキュメント #1:
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script src="jquery.fancybox-1.3.4/fancybox/jquery.fancybox-1.3.4.pack.js" type="text/javascript"></script>
<link href="jquery.fancybox-1.3.4/fancybox/jquery.fancybox-1.3.4.css" rel="stylesheet" type="text/css">
<link href="test.css" rel="stylesheet" type="text/css">
<script type="text/javascript">
$(document).ready(function() {
$("#fancyBoxLink").fancybox({
'transitionIn' : 'elastic',
'transitionOut' : 'elastic',
'speedIn' : 700,
'speedOut' : 200,
'overlayShow' : false
});
});
</script>
</head>
<body>
<center>
<p>
You can
<a href="#div_table" id="fancyBoxLink">Click here to see our various things</a>
</p>
</center>
<div style="display:none" >
<div id="div_table">
<table id="payment_options" summary="Payment Plans">
<colgroup>
<col class="poptions-odd">
<col class="poptions-even">
<col class="poptions-odd">
<col class="poptions-even">
</colgroup>
<thead>
<tr>
<th scope="col" id="poptions-features">Features</th>
<th scope="col" id="poptions-startup">Startup</th>
<th scope="col" id="poptions-value">Standard</th>
<th scope="col" id="poptions-premium">Premium</th>
</tr>
</thead>
<tbody>
<tr>
<td>Plan one</td>
<td>2</td>
<td>5</td>
<td>Unlimited</td>
</tr>
</tbody>
</table>
</div>
</div>
</body>
</html>
ドキュメント #2:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>{ visibility: inherit; } The Fancybox Photo Gallery Demo #1</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="fancybox.js"></script>
<link href="images/fancybox.css" rel="stylesheet" type="text/css">
<link href="../photoGallery.css" rel="stylesheet" type="text/css">
<script type="text/javascript">
$('html').addClass('js-on');
/* Fire Fancybox */
$(document).ready(function() {
$("a").fancybox({
'titleFormat':function(itemTitle, itemArray, itemIndex, itemOpts) {
return itemTitle + '<span> Image ' + (itemIndex + 1) + ' of ' + itemArray.length + '</span>';
}
});
});
</script>
</head>
<body>
<h1>Prote(C#)tion Photo Gallery</h1>
<div id="gallery">
<a href="../SlideShow/mainPage.png" rel="gallery" title="Authentication Page."><img src="../SlideShow/mainPage.png" alt="" id="first"><span></span></a>
<a href="../SlideShow/importSettings.png" rel="gallery" title="Import any previously saved settings."><img src="../SlideShow/importSettings.png" alt=""></a>
</div>
</body>
</html>
専門家への最後の質問です!: ドキュメント 1 とドキュメント 2 の 2 つの見出しをどのように組み合わせることができますか? これらの見出しスクリプトは何らかの方法で組み合わせる必要があります。これが私の問題だと思います。