※ ChatGPTを利用し、要約された質問です(原文:jqueryとlightboxが一緒に動作しない)
jqueryとlightboxが一緒に動作しない
このQ&Aのポイント
jqueryとlightboxを1頁内に記述しているのですが、どちらか一方だけしか動作しません。
jqueryの記述の箇所とlightboxの記述の箇所を上下させると片方が動作し、片方が動作しないという具合です。
最後に設定した方が実行されるようです。どこを修正すればいいのかまったくわかりません。両方動作させることはできませんか?
jqueryとlightboxを1頁内に記述しているのですが、どちらか一方だけしか動作しません。
jqueryの記述の箇所とlightboxの記述の箇所を上下させると片方が動作し、片方が動作しないという具合です。
最後に設定した方が実行されるようです。どこを修正すればいいのかまったくわかりません。
両方動作させることはできませんか?
ソースコードは以下のようになっています。
<?xml version="1.0" encoding="shift_jis"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" />
<meta http-equiv="content-script-type" content="text/javascript" />
<meta http-equiv="content-style-type" content="text/css" />
<meta name="Keywords" content="XXX,XXX" />
<meta name="Description" content="XXX,XXX" />
<title>XXXXXX</title>
<link rel="stylesheet" href="style.css" type="text/css" />
<link rel="stylesheet" href="XXX.css" type="text/css" />
<script src="http://code.jquery.com/jquery-1.6.min.js" type="text/javascript" charset="UTF-8"></script>
<script type="text/javascript">
<!--menu_headクラスを持つp要素にマウスオーバーされた時に、menu_bodyクラスを持つ要素をスライドする-->
$(function() {
$("#menu_list p.menu_head").mouseover(function() {
$(this).css({backgroundImage:"url(img/left-side-a.png)"}).next("div.menu_body").slideDown(500).siblings("div.menu_body").slideUp("slow");
$(this).siblings();
});
});
</script>
<!-- コメント -->
<link href="css/lightbox.css" type="text/css" rel="stylesheet" media="screen" />
<script src="js/prototype.js" type="text/javascript"></script>
<script src="js/scriptaculous.js?load=effects,builder" type="text/javascript"></script>
<script src="js/lightbox.js" type="text/javascript"></script>
<!-- コメント -->
<style type="text/css">
/* */
}/* <![CDATA[ */
a img{border:0 none}
/* ]]> */
</style>
</head>
宜しくお願いします。
お礼
jquery版のlightboxがあるんですね。 試してみます。ありがとうございました。