Fancybox 打开一个文本文件？答案

【问题标题】：Fancybox to open a text file?Fancybox 打开一个文本文件？
【发布时间】：2012-12-19 12:00:29
【问题描述】：

我想创建一个网站，我可以在其中预览某种类型的 FancyBox 文件，例如图像、文本文档等。

这样做：

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

<a class="text" href="document.css" title="document.css"><img src="files.png"/>OPEN ME</a>

它会打开文档，但它不尊重文档的边距和格式，我的意思是，所有内容都写在同一行中，因为我想它打开它就像它是一个 HTML，而不是一个文本编辑器。

那么有没有人如何以 Notepad++ 或 GEdit 的方式打开它，例如打开它？

谢谢！

【问题讨论】：

请将其添加到jsfiddle.net，并显示更多详细信息
您需要将要打开的文档作为参数传递给父页面，该页面获取文件并使用插件对其进行格式化，例如 SyntaxHiglighter:alexgorbatchev.com/SyntaxHighlighter。在浏览器中打开文本文件会导致无法阅读的混乱。
好的，我刚刚意识到，如果您将“text”类的属性“type: iframe”添加到fancybox，它就可以正常工作。 $(".text").fancybox({ 'type' : 'iframe' });
@RoryMcCrossan 哦，我已经检查了该网址，好吧，我认为包含它可能非常有用。非常感谢！

【解决方案1】：

对于大多数文本文件，您可能需要使用 iframe 打开它们，以便保持格式，然后您的链接应如下所示：

<a class="text fancybox.iframe" href="http://fancyapps.com/fancybox/source/jquery.fancybox.css">open css file</a>

...注意特殊类fancybox.iframe。然后你的代码很简单：

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

见DEMO

更多关于如何选择fancyboxtype的内容，请查看：https://stackoverflow.com/a/13869696/1055987

【讨论】：