ライトボックスを使用して Google カレンダーを開こうとしています。Colorbox を使用して別の Web ページでそれが行われているのを見たことがあります (ここ: http://www.orovalleybicycle.com/右側の [カレンダー全体に展開] をクリックします)。 colorbox) カレンダーが colorbox 内で開くことを拒否しています。カラーボックスをトリガーする必要があるハイパーリンクをクリックすると、ページから離れて、Google カレンダーの URL が直接開きます。
基本的に、これが私のコードの関連部分です...デモページ（http://www.jacklmoore.com/colorbox/example1/）にあるものを可能な限り複製して、動作する必要があることを確認しました(相対 URL が表示されている場合を除き、実際には絶対 URL を使用しましたが、セキュリティと簡素化のために変更されています):
私の<head>タグで：
<link rel="stylesheet" href="colorbox/colorbox.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script type="text/javascript" src="colorbox/jquery.colorbox.js"></script>
<script>
$(document).ready(function(){
$(".colorboxcal").colorbox({iframe:true, width:"80%", height:"80%", transition:"fade"});
});
</script>
体内で：
<a class="colorboxcal" href="https://www.google.com">Open Full Calendar</a>
しかし、基本的には、次のように動作します。
<a href="https://www.google.com">Open Full Calendar</a>
問題の原因を突き止めるために、次のことを試しました。
- 絶対パスが正しいことを確認しました
- jquery.min の参照をローカル マシンのコピーに変更してみましたが、別のバージョンを試してみました (違いはありませんでした)。
- 「href」を変更して、PC の画像を参照しようとしました (結果: リンクをクリックすると、ブラウザ ウィンドウで画像が開かれたため、同じ古い問題が発生しました)。
- href 属性を
<script>上部のコードに移動します (結果: リンクをクリックしても何も起こりませんでした。間違ったカーソルが表示され、リンクのように動作せず、テキストだけです。) - テストページに同じコードを入れて、必要最小限のものだけを入れます（結果：リンクをクリックするとURLが開いたので、同じ古い問題です）。
- 幅と高さを除く.colorboxのデフォルトのものを上書きするすべての属性を削除しようとしました（結果：同じ古い問題）
- ものを削除して、必要なタグのすぐ下にコード
ready(function()を配置しようとしました（結果：同じ古い問題）<script></a>
カラーボックスが実際にトリガーまたはロードされているかどうかを確認したいのですが、方法がわかりません。
私がチェックしたところ、私のページは xhtml として適切に検証されたので (w3 を使用し、dreamweaver を使用して)、愚かな閉じられていないタグや問題を引き起こしているものはないと思います。しかし、私が見落としていたのと同じように明らかなことかもしれません! 私はphpを使用してヘッダーとフッターとナビゲーションを呼び出しています。サイトの他の場所に、javascriptとjqueryを使用する画像「スライダー」があり、正常に機能しています。firefox と chrome で (ローカルにホストされている) 確認してみましたが、結果はどちらも同じなので、ブラウザの問題とは関係ないと思います。私のphpはエラーになっています...xampp liteによって解析されます（？そこに正しい用語はありますか？）が、グーグルで調べたところ、予想される競合が見つかりませんでした。
私はこのサイトを html、php、javascript、jquery の完全な初心者として構築し始めました。しかし、カラーボックスが機能しない理由について何か提案はありますか? 前もって感謝します！！