站内的 Box.net 外链网盘
MD,想这个标题想了我十几分钟,最后还是写了这傻不拉唧的标题,哎,谁让我没文学细胞呢。
Box.net 这个网盘大家应该不是很陌生,曾经风靡一时的网盘,它漂亮的 WEB2.0 界面非常吸引我,只可惜好景不常,就被伟大的“功夫王”给XXOO了。后来 Box 也重新注册了一个新的域名 boxcn.net ,专门给国人使用,但是用着boxcn
心里总感觉和 box 原版的有点区别,于是很长一段时间都没有再去box
。直到前段时间,在林木木的博客中看到了一篇文章,用jQuery读取 Box 文件的外链,于是我好奇的输入 box.net ,发现可以访问了,“功夫王”居然把 box 给释放了。
前话就这些了,下面进入主题,首先大家看看这个页面,这个就是读取 box 文件外链做的展示页面,其制作方法大家请看林木木写的《制作 Box.net 文件外链展示页面》,我这里要做的就是把这个页面嵌套到博客中来,效果大家点击导航栏中的“网盘”。是不是很炫啊?呵呵,下面开始教大家做这个效果。
第一步
添加Highslide JS
如果你博客安装了Highslide4WP或Auto Highslide的话,那么就不需要再添加Highslide JS
了,只需要修改一下这个插件的代码即可。
分别编辑插件下的highslide4wp.php
或auto-highslide.php
文件,找到:hs.outlineType = "rounded-white";
在下面加入一行:hs.wrapperClassName = "draggable-header";
再找到:highslide/highslide-with-html.packed.js
修改成:highslide/highslide-full.packed.js
再把highslide-full.packed.js上传至插件中的highslide
目录下,highslide-with-html.packed.js
文件可以删除了。
以上是安装了Highslide4WP或Auto Highslide的修改方法,没有安装这两个插件的朋友可以按照如下方法进行。
首先下载Highslide JS,把highslide
文件夹中除了highslide.css
、graphics文件夹
、highslide-full.packed.js
三个,其他的都删除,然后把highslide
上传至某处地方,一般是wp-content/plugins
下。
再打开主题中的头部文件header.php
,插入如下代码:<link rel="stylesheet" type="text/css" href="../highslide/highslide.css" />
其中那三个路径的地方,一定要写正确。
还是建议使用上面两个插件,推荐Auto Highslide
。
第二步
导航栏中添加网盘的超链接 不同主题的添加方法不同,下面以我的主题iNove
为例,打开主题下templates/header.php
文件,找到: <ul id="menus"></ul>
在这个id
为menus
的无序列表中,插入一个 li :`
第三步
添加iframe
效果,在你的Query
应用js
文件中,添加如下代码:
1 | $("#navigation .mybox").click(function() { |
PS:其他的参数大家可以参考Highslide JS API Reference,比如最小高度等等。怎么应用jQuery
就不说了,已经讲过很多次,实在不会的可以去问Google
老师。
到这里这个效果就做完了,有什么不懂的大家回复交流。