Mantis的附件图片实现预览/弹出层动画效果预览图片(LightBox2)的完美解决方案[Z]
方法1:
在Mantis的配置文件中,加入此句,将这个值设的很大,就可以直接看到图片
1 |
$g_preview_attachments_inline_max_size =1000000; |
效果如图
这个方法其实不错,但是有个弊端,小尺寸的图片效果不错,但是大尺寸的图片,可能就还是看不起,还是得下载下来看,
如上图的第三张图片
于是继续探究
方法2:
在Mantis的配置文件config_inc.php加
1 |
$g_form_security_validation = OFF; |
然后在core\file_api.php文件中,修改一段内容
1 |
$t_attachment [ 'download_url' ] = "file_download.php?file_id=$t_id&type=bug&show_inline=1" ; |
此方法实现的效果就是,点击图片附件,将不会下载,而是直接在本页面预览大图片,基本已经很方便实用了
方法3:
这个方法我们引入第三方控件,实现更佳酷炫的图片预览效果
1.下载lightbox2 ,地址http://lokeshdhakar.com/projects/lightbox2/
解压js和css两文件夹(其他不用)到mantis根目录下
2.到core\print_api.php下,找到print_bug_attachments_list 方法,在其内部加上
1 |
echo "<script src=\"js/jquery-1.7.2.min.js\"></script>" ; |
2 |
3 |
echo "<script src=\"js/jquery-ui-1.8.18.custom.min.js\"></script>" ; |
4 |
5 |
echo "<script src=\"js/jquery.smooth-scroll.min.js\"></script>" ; |
6 |
7 |
echo "<script src=\"js/lightbox.js\"></script>" ; |
8 |
9 |
echo "<link rel=\"stylesheet\" href=\"css/lightbox.css\" type=\"text/css\" media=\"screen\" />" ; |
(就是使其倒入刚下载的js与css)
3.继续在到core\print_api.php下,找到if ( $t_attachment['can_download'] ),将第一处的a标签最后,加入rel=”lightbox”或者rel=”lightbox[groupname]“,就是这样
1 |
$t_href_start = '<a href="' . string_attribute( $t_attachment [ 'download_url' ] ) . '" rel="lightbox[group]" >' ; |
4.再修改一下if ( !$t_attachment['exists'] ) 中的部分内容就更完美了
比如注释掉echo $t_href_start;
1 |
//echo $t_href_start; |
再将
1 |
echo $t_href_end . ' ' . $t_href_start . $t_file_display_name . $t_href_end . $t_href_clicket . ' (' . $t_filesize . ' ' . lang_get( 'bytes' ) . ') ' . '<span>' . $t_date_added . '</span>' ; |
改成
1 |
echo $t_file_display_name . $t_href_clicket . ' (' . $t_filesize . ' ' . lang_get( 'bytes' ) . ') ' . '<span>' . $t_date_added . '</span>' ; |
OK,我们一起看一下现在的效果,点击图片
现在就变的很酷炫了哦!还可以直接看下一张图片。赶紧试试吧,
以上3种方法均是独立的,您只要选择一种或二种。推荐1和3配合
Mantis的附件图片实现预览/弹出层动画效果预览图片(LightBox2)的完美解决方案[Z]的更多相关文章
- UIAlertView弹出视图动画效果
在App设计中为了加强用户体验,我们会常常加入一些友好的动画效果.比如类似UIAlertView弹出的动画效果,由于系统中并没有直接提供类似的动画API,如果我们想要做出一样的效果,那就得深入的研究一 ...
- div弹出层的效果带关闭按钮
下面我做的这个是个进度条的弹出层 <style type="text/css"> #tuxiang { width: 57px; } /*div弹出框的css*/ .t ...
- jq原创弹出层折叠效果
弹出层效果很多网站上都用到,今天就整理最近项目里用到的一个小效果,点击折叠弹出一个层给用户填写信息.弹出层代码都是jq动态创建,每个人写法都不一样,需求也不一样,所有选择符合自已的即可. html: ...
- html+javascript实现可拖动可提交的弹出层对话框效果
本文为大家介绍下使用html+javascript实现可拖动弹出层.对话框.可提交,具体代码如下,感兴趣的朋友可以参考下,希望对大家有所帮助 <!DOCTYPE HTML PUBLIC &quo ...
- 窗体 dialog 弹出时动画效果
1.先创建 anim中的 xml 动画文件 <?xml version="1.0" encoding="utf-8"? > <set x ...
- jQuery第三课 点击按钮 弹出层div效果
jQuery 事件方法 事件方法会触发匹配元素的事件,或将函数绑定到所有匹配元素的某个事件. 触发实例: $("button#demo").click() 上面的例子将触发 id= ...
- 微信小程序弹出层动画特效
.rules_modal_cont{ height:800rpx; width:200rpx; -webkit-animation: showZeroAlert .3s; animation: sho ...
- Jquery和Javascript 实际项目中写法基础-弹出窗和弹出层 (4)
一.实际项目中有很多如下界面效果. 二.该效果可以归结为弹出窗或者弹出层来实现的,为什么这么说?看如下代码: <!DOCTYPE html> <html> & ...
- jQuery点击弹出层,弹出模态框,点击模态框消失
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 3 ...
随机推荐
- POJ 3368 RMQ-ST
一直感觉RMQ水,没自己写过,今天写了一道题,算是完全独立写的,这感觉好久没有了... 一直以来,都是为了亚洲赛学算法,出现了几个问题: 1.学的其实只是怎么用算法,对算法的正确性没有好好理解,或者说 ...
- 自动测试工具SilkTest全面介绍
象交互,并最终记录测试结果,用户可以根据这些测试结果来判断测试成功还是失败. 4Test 脚本语言 和绝大多数自动化测试工具一样, SilkTest 可以自动捕捉,检测和重复用户交互的操作从而驱动测试 ...
- jQuery中设置form表单中action值的方法
jQuery中设置form表单中action值的方法 (2011-03-17 10:18:19) 转载▼ 标签: 杂谈 html代码: <form id="myFormId&quo ...
- 【Android Studio】studio学习系列(一) 从eclipse导入project
Android google官方出的IDE android studio 一直都在走bate版本号,尽管如此,总认为它比ADT更加靠谱.所以我也想用studio来开发滴.可项目一直都是eclipse的 ...
- 《think in python》学习-7
think in python 7 迭代 对一个变量可以进行多次赋值 是合法的. 例如以下: bruce = 5 print bruce bruce = 7 print bruce 因为有了多重赋值 ...
- [jQuery]无法获取隐藏元素(display:none)宽度(width)和高度(height)的新解决方案
在做茶城网改版工作的时候,又遇到一个新问题,我需要用jQuery写一个通过点击左右图标来翻阅图片的小插件,写好后测试可以正常运行,但是放到Tab中后发现只有第一个Tab中的代码能够正常运行,其它全部罢 ...
- Spring-----代码中使用注入的Properties配置属性
转载自:http://blog.csdn.net/hekewangzi/article/details/49990799
- CODEVS1047 邮票面值设计
题目描述 Description 给定一个信封,最多只允许粘贴N张邮票,计算在给定K(N+K≤40)种邮票的情况下(假定所有的邮票数量都足够),如何设计邮票的面值,能得到最大值MAX,使在1-MAX之 ...
- linux系统下memcached启动正常但程序无法连接的问题解决
在虚拟机linux安装好memcached之后,试着用java程序连接一下memcached的服务端,但却出现了以下错误 com.schooner.MemCached.SchoonerSockIOPo ...
- jquery1.11做的改变
$('#btn-checkall').on('click', function(){}); //替换为 $('#btn-checkall-parent-static-node').on('click' ...