• Mantis的附件图片实现预览/弹出层动画效果预览图片(LightBox2)的完美解决方案[Z]


    方法1:

    在Mantis的配置文件中,加入此句,将这个值设的很大,就可以直接看到图片

    1 $g_preview_attachments_inline_max_size=1000000;

    效果如图

    这个方法其实不错,但是有个弊端,小尺寸的图片效果不错,但是大尺寸的图片,可能就还是看不起,还是得下载下来看,

    如上图的第三张图片

    于是继续探究

    方法2:

    在Mantis的配置文件config_inc.php加

    1 $g_form_security_validation = OFF;

    然后在corefile_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.到coreprint_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.继续在到coreprint_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 '&#160;' $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配合

    转载自Chengaomin's Blog

  • 相关阅读:
    JS实现checkbox全选功能
    JS回车检索
    MockServer 之postman
    Locust性能测试
    Bitter.Core系列二:Bitter ORM NETCORE ORM 全网最粗暴简单易用高性能的 NETCore ORM 之数据库连接
    MSSQL 经典语句查看表字典结构语句
    使用 Path.Combine 构建跨平台文件路径拼接
    迁移备份WSL2下的子系统/迁移Windows 10 Docker Data目录/踩坑记录
    MSSQL 20212 高可用集群方案2012的AlwaysOn高性能组件
    MSSQL 经典SQL 语句WITH递归
  • 原文地址:https://www.cnblogs.com/huak/p/3860604.html
Copyright © 2020-2023  润新知