我是JQuery中彩盒的新用户。我一直试图让我的计算机上的示例代码工作,当我点击他们刚刚在新窗口/标签中打开的链接时,图像将不会显示在'colorbox'中。所以我会告诉你我的代码。我需要帮助你可能很明显的事情,因为我是初学者。谢谢!
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href="colorbox.css" rel="stylesheet" type="text/css" />
<script src="jquery.min.js"></script>
<script src="jquery.colorbox-min.js"></script>
</head>
<title>Untitled Document</title>
<body>
<!--JQuery library-->
<a href="http://jquery.com/">jQuery</a>
<script src="jquery.js"></script>
<script>
var foo = "bar";
</script>
<!--Colorbox Call-->
<a class='gallery' href='images/DSC_0114.JPG'>Photo_1</a>
<a class='gallery' href='images/34180_1473822933002_1456544245_1218149_7765685_n.jpg'>Photo_2</a>
<a class='gallery' href='images/26577_1337288319722_1456544245_897498_8319969_n.jpg'>Photo_3</a>
<script>
jQuery('a.gallery').colorbox();
</script>
</body>
<link href="test.css" rel="stylesheet" type="text/css" />
<div class="box" id="box">Content for class "box" id "box" Goes Here</div>
这些是我用来帮助的网站,但他们没有回答这些非常小的问题。
http://www.jacklmoore.com/colorbox/guide http://learn.jquery.com/about-jquery/how-jquery-works/
我是否需要将网站上传到网络以使彩色框工作?
答案 0 :(得分:0)
您第二次附加了jquery.js
,我认为这会破坏代码jquery.colorbox-min.js
,因此无效。删除第二个。
你应该删除这一行,
<script src="jquery.js"></script>
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href="colorbox.css" rel="stylesheet" type="text/css" />
<script src="jquery.min.js"></script>
<script src="jquery.colorbox-min.js"></script>
</head>
<title>Untitled Document</title>
<body>
<a class='gallery' href='images/DSC_0114.JPG'>Photo_1</a>
<a class='gallery' href='images/34180_1473822933002_1456544245_1218149_7765685_n.jpg'>Photo_2</a>
<a class='gallery' href='images/26577_1337288319722_1456544245_897498_8319969_n.jpg'>Photo_3</a>
<script>
jQuery('a.gallery').colorbox();
</script>
<link href="test.css" rel="stylesheet" type="text/css" />
<div class="box" id="box">Content for class "box" id "box" Goes Here</div>
</body>
</html>
以下是您分享的最新代码
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href="colorbox.css" rel="stylesheet" type="text/css" />
<script src="Colorbox/jquery.colorbox-min.js"></script>
<script src="Colorbox/jquery.min.js"></script>
<link href="test.css" rel="stylesheet" type="text/css" />
</head>
<title></title>
<a class='gallery' href='images/money2.jpg'>Photo_1</a>
<a class='gallery' href='images/money2.jpg'>Photo_2</a>
<a class='gallery' href='images/money2.jpg'>Photo_3</a>
<script> jQuery(document).ready(function() { jQuery('a.gallery').colorbox(); }); </script>
Colorbox
文件夹中必须有这些文件,