- Categories
- 好友博客
- 常泡的论坛
- 常用手册工具
- 母校&&同学校友
- 网络大牛
分享一个简单的点击图片进入下一页方法
Filed under: CMS/BBS开源原创作品, Js/Css/Html/Xml — Tags: 图片翻页 — 花太香齐 @ 2009年12月10日 6:32 pm本blog文章如没特殊声明均为原创文章，转载请注明出处，谢谢！
实现方法很简单：
1.修改CMS发布系统编辑器，在上传图片时自动加上 onclick=”gonext();”
2.修改CMS模板，在头部加上如下的JavaScript函数gonext
3.修改CMS程序分页部分代码，在生成的下一页链接时加上 id=’nextid’
实现效果演示：http://aion.houdao.com/200909/26455.html
最近页面效果：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<script language="javascript">
function gonext()
{
var url=document.getElementById('nextid')?document.getElementById('nextid').href:'';
if(url==''){alert('当前最后一页');return;}
location.href=url;
}
</script>
</head>
<body>
<!-- 文章内容区 -->
<p align="center"><img title="点击图片翻页" style="cursor: hand" onclick="gonext();" src="http://image.aaa.com/tu.jpg" /></p>
<!-- 翻页区 -->
<p align='center'>
<a>上一页</a>
<a>1</a>
<a href='26455_2.html'>2</a>
<a href='26455_3.html'>3</a>
<a href='26455_4.html'>4</a>
<a href='26455_5.html'>5</a>
<a id='nextid' href='26455_2.html'>下一页</a>
</p>
</body>
</html>
<html>
<head>
<script language="javascript">
function gonext()
{
var url=document.getElementById('nextid')?document.getElementById('nextid').href:'';
if(url==''){alert('当前最后一页');return;}
location.href=url;
}
</script>
</head>
<body>
<!-- 文章内容区 -->
<p align="center"><img title="点击图片翻页" style="cursor: hand" onclick="gonext();" src="http://image.aaa.com/tu.jpg" /></p>
<!-- 翻页区 -->
<p align='center'>
<a>上一页</a>
<a>1</a>
<a href='26455_2.html'>2</a>
<a href='26455_3.html'>3</a>
<a href='26455_4.html'>4</a>
<a href='26455_5.html'>5</a>
<a id='nextid' href='26455_2.html'>下一页</a>
</p>
</body>
</html>
评论
发表新评论