软件下载 | 资讯教程 | 最近更新 | 下载排行 | 一键转帖 | 发布投稿
您的位置:最火下载站 > 建站程序 > SNS程序 > UCenter Home 2.0相册加强完整教程

UCenter Home 2.0相册加强完整教程

该教程适合UCHome1.5叉叉版本 和 UCHome2.0叉叉版本,应该以后的版本都支持,就算不支持,我们也可以根据这个教程的代码修改一下。
这个教程的代码我都加了注释,大家应该都看得懂。
本教程绝对原创,功能实现代码全是本人自己所写,因为这个是“Comsenz 教程达人”投稿作品,所以谢绝转载。
如果大家觉得这个教程不错,请回复,评分或顶踩,谢谢。

本教程包括“切换照片的快捷键”,“自动定位到照片”,“照片左右箭头切换”,“相册缩小、放大、顺旋”,“照片下载”五大功能加强,大家可以根据自己的需要选择,可以单独选择一个功能或完整,若是单独加强某功能,请查看2楼,可能有需要注意的地方。
该教程还给照片添加了alt标签,有助于照片被搜索引擎收录。

1.切换照片的快捷键和自动定位到照片
1a.打开 template/default/space_pic.htm
查找

Copy to ClipboardLiehuo.Net Codes引用的内容:[www.veryhuo.com]
<div style="padding-top:20px; width:100%; overflow:hidden;" id="pic_comment">
在其上面增加代码
Copy to ClipboardLiehuo.Net Codes引用的内容:[www.veryhuo.com]
<script type="text/javascript">

//相册左右快捷键切换照片加强
document.onkeydown = function()
{
if(event.keyCode == 37)
{
window.location.href='space.php?uid=$pic[uid]&do=album&picid=$pic[picid]&goto=up';
}
if(event.keyCode == 39)
{
window.location.href='space.php?uid=$pic[uid]&do=album&picid=$pic[picid]&goto=down';
}
}

//自动定位到照片加强
if(window.location.hash == "")
{
window.location.href='#playid';
}
</script>
这样就增加了切换照片的快捷键和自动定位到照片

接下来我们为相册切换的快捷键功能增加个说明(觉得没必要的朋友可以不操作这一步)
1b.我们还是打开 template/default/space_pic.htm
搜索
Copy to ClipboardLiehuo.Net Codes引用的内容:[www.veryhuo.com]
<a href="$theurl&goto=up">上一张</a><span class="pipe">|</span>

在其上面增加

Copy to ClipboardLiehuo.Net Codes引用的内容:[www.veryhuo.com]
按方向键 ← 或 → 可切换图片

2.照片左右箭头切换加强

2a.打开 template/default/space_pic.htm
搜索

Copy to ClipboardLiehuo.Net Codes引用的内容:[www.veryhuo.com]
<a href="$theurl&goto=down"><img src="$pic[pic]" alt="" /></a>
替换成
Copy to ClipboardLiehuo.Net Codes引用的内容:[www.veryhuo.com]
<img src="$pic[pic]" id="pic_element" onMouseMove="ProcessPage(1)" onClick="Album_Goto()" alt="$pic[title]" />
2b.再查找
Copy to ClipboardLiehuo.Net Codes引用的内容:[www.veryhuo.com]
//-->
</script>
替换成
Copy to ClipboardLiehuo.Net Codes引用的内容:[www.veryhuo.com]
var Album_Goto_Up="$theurl&goto=up";
var Album_Goto_down="$theurl&goto=down";
//-->
</script>
<script src="plugin/photo_enhance/script.js" type="text/javascript"></script>

2c.把plugin.rar下载解压,把里面问文件上传到UCHome根目录

3.相册缩小、放大、顺旋加强
3a.打开 template/default/space_pic.htm
搜索

Copy to ClipboardLiehuo.Net Codes引用的内容:[www.veryhuo.com]
<!--{if $album['friend']}-->
<span class="locked gray">{$friendsname[$value[friend]]}</span>
<!--{/if}-->
在下面增加:
Copy to ClipboardLiehuo.Net Codes引用的内容:[www.veryhuo.com]
<a href="javascript:Images_Small()" title="缩小照片">缩小</a>
<a href="javascript:Images_Big()" title="放大照片">放大</a>
<a href="javascript:Rotation_Way('1')" title="逆时针旋转照片">顺旋转</a>
<a href="javascript:Rotation_Way('0')" title="逆时针旋转照片">逆旋转</a>
4.照片下载加强
4a.打开 template/default/space_pic.htm
查找
Copy to ClipboardLiehuo.Net Codes引用的内容:[www.veryhuo.com]
<a href="$pic[pic]" target="_blank">查看原图</a>
在其上面增加
Copy to ClipboardLiehuo.Net Codes引用的内容:[www.veryhuo.com]
<!--{eval $pic[down_pic]=str_replace("attachment/", "file.php?name=", $pic[pic]);}-->
<a href="$pic[down_pic]" target="_blank">下载该图</a>
<span class="pipe">|</span>

4b.把File.rar下载解压,把里面问文件上传到UCHome根目录。

演示 http://quan.96px.com/space-4-do-album-picid-2279.html

    相关阅读
    栏目导航
    推荐软件