使用fancybox工具使图片库无效

时间:2015-05-08 09:49:46

标签: html css

我试图将fancybox工具添加到我的页面,它的工作原理但不是这个例子:

我的代码:

<head>
<title>Image  Gallery</title>
<link rel="stylesheet" href="file:///D:/CSS%20projects/image%20gallery/CSS/style.css">
<link rel="styleshhet" href="file:///D:/CSS%20projects/image%20gallery/CSS/jquery.fancybox.css">
<link rel="styleshhet" href="file:///D:/CSS%20projects/image%20gallery/CSS/jquery.fancybox-buttons.css">
<link rel="styleshhet" href="file:///D:/CSS%20projects/image%20gallery/CSS/jquery.fancybox-thumbs.css">


<script src="file:///D:/CSS%20projects/image%20gallery/js/jquery.js"></script>
<script src="file:///D:/CSS%20projects/image%20gallery/js/jquery.fancybox.pack.js"></script>
<script src="file:///D:/CSS%20projects/image%20gallery/js/jquery.fancybox-buttons.js"></script>
<script src = "file:///D:/CSS%20projects/image%20gallery/js/jquery.fancybox-media.js"></script>
<script src = "file:///D:/CSS%20projects/image%20gallery/js/jquery.fancybox-thumbs.javascript"></script>

<script type ="text/javascript">
  $(document).ready(function() {

    $(".fancybox").fancybox();  


  });
</script>


</head>



<body>

  <header>
    <div class="container">
<img src="file:///D:/CSS%20projects/image%20gallery/images/logo.jpg" class="logo">
</div>
  </header>

<div class="container">
  <section>
<div class="gallery">
<a class ="fancybox" data-fancybox-group="gallery" href="file:///D:/CSS%20projects/image%20gallery/images/img1.jpg">
<img src="file:///D:/CSS%20projects/image%20gallery/images/img1.jpg"></a>

<a class ="fancybox" data-fancybox-group="gallery" href="file:///D:/CSS%20projects/image%20gallery/images/img2.jpg">
<img src="file:///D:/CSS%20projects/image%20gallery/images/img2.jpg"></a>

<a class ="fancybox" data-fancybox-group="gallery" href="file:///D:/CSS%20projects/image%20gallery/images/img3.jpg">
<img src="file:///D:/CSS%20projects/image%20gallery/images/img3.jpg"></a>

<a class ="fancybox" data-fancybox-group="gallery" href="file:///D:/CSS%20projects/image%20gallery/images/img4.jpg">
<img src="file:///D:/CSS%20projects/image%20gallery/images/img4.jpg"></a>

<a class ="fancybox" data-fancybox-group="gallery" href="file:///D:/CSS%20projects/image%20gallery/images/img5.jpg">
<img src="file:///D:/CSS%20projects/image%20gallery/images/img5.jpg"></a>

<a class ="fancybox" data-fancybox-group="gallery" href="file:///D:/CSS%20projects/image%20gallery/images/img6.jpg">
<img src="file:///D:/CSS%20projects/image%20gallery/images/img6.jpg"></a>
</div>



  </section>
  <aside>
  <nav>
<a data-rel="all"href="javascript;">view all</a>
<a data-rel="category1" href="javascript;">category 1</a>
<a data-rel="category2" href="javascript;">category 2</a>


  </nav>
</aside>
</div>

<footer>
<div class="container">
  <p>Copyright &copy; 2014</p> 
</div>
</footer>
</body>

</html>

我下载所有css,java文件正确并将它们链接到我的HTML文件中。

然而,结果是图片只是弹出正常但它也有点像卡住了。看起来我只是忘了一些东西......

感谢。

1 个答案:

答案 0 :(得分:0)

using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; using System.Drawing; using System.Linq; using System.Text; using System.Windows.Forms; using System.IO; using System.Diagnostics; using System.Xml; using System.Xml.Linq; namespace generate_XML_open_folder { public partial class Form1 : Form { public Form1() { InitializeComponent(); } private void button_generate_XML_Click(object sender, EventArgs e) { string rootPath = combobox_rootpath.Text; var dir = new DirectoryInfo(rootPath); var doc = new XDocument(GetDirectoryXml(dir)); doc.Save("test.xml"); } private void button_open_folder_Click(object sender, EventArgs e) { } private void textbox_folder_to_find_TextChanged(object sender, EventArgs e) { } private void combobox_rootpath_SelectedIndexChanged(object sender, EventArgs e) { combobox_rootpath.Items.Clear(); foreach (string s in Directory.GetLogicalDrives()) { combobox_rootpath.Items.Add(s); } } public static XElement GetDirectoryXml(DirectoryInfo dir) { var info = new XElement("dir", new XAttribute("name", dir.Name)); //foreach (var file in dir.GetFiles()) // info.Add(new XElement("file", // new XAttribute("name", file.Name))); foreach (var subDir in dir.GetDirectories()) info.Add(GetDirectoryXml(subDir)); return info; } } } returns all the elements with the class fancybox. You need to iterate over each element using JQuery's $.each()