电力项目十三--js添加highslider特效
Posted panzer
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了电力项目十三--js添加highslider特效相关的知识，希望对你有一定的参考价值。
当页面的一个table表格无法显示所有的内容的时候，点击【查看详细信息】，显示详细内容：
下载css，js
1.在actingIndex.jsp中添加：引入js和css：
<LINK href="${pageContext.request.contextPath }/css/openView.css" type="text/css" rel="stylesheet">
<script type="text/javascript" src="${pageContext.request.contextPath }/script/highslide/highslide.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/script/highslide/highslide-html.js"></script>
2.添加javascript
<script type="text/javascript"> hs.graphicsDir = ‘${pageContext.request.contextPath }/script/highslide/graphics/‘; hs.outlineType = ‘rounded-white‘; hs.outlineWhileAnimating = true; </script>
3.actingIndex.jsp页面中添加代码
<div>
<a style="CURSOR:hand" href="${pageContext.request.contextPath }/system/elecCommonMsgAction_actingView.do?" onclick="return hs.htmlExpand(this, { contentId: ‘highslide-html-1‘, objectType: ‘ajax‘, preserveContent: true} )">
<div class="scrollStyle" align="left" style="table-layout:fixed;">
查看设备详细信息
</div>
</a>
<div class="highslide-html-content" id="highslide-html-1" style="width: 700px">
<div class="highslide-move" style="border: 0; height: 18px; padding: 2px; cursor: default">
<a href="#" onClick="return hs.close(this)" class="control">[关 闭]</a>
</div>
<div class="highslide-body"></div>
</div>
</div>
4.ElecCommonMsgAction.java
//添加highslider特效 public String actingView(){ ElecCommonMsg commonMsg = elecCommonMsgService.findCommonMsg(); ValueUtils.putValueStack(commonMsg); return "actingView"; }
5.actingView.jsp页面
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib uri="/struts-tags" prefix="s"%>
<html>
<head>
<title>显示运行监控记录</title>
<LINK href="${pageContext.request.contextPath }/css/Style.css" type="text/css" rel="stylesheet">
</head>
<body>
<table cellspacing="1" cellpadding="0" width="100%" align="center" bgcolor="#f5fafe" border="0">
<TR height="10">
<td class="ta_01">
<s:property value="devRun"/>
</td>
</TR>
</table>
</body>
</html>
以上是关于电力项目十三--js添加highslider特效的主要内容，如果未能解决你的问题，请参考以下文章
Cesium 与 Babylon.js 可视化 glsl 特效篇（十三）