界面框架初步提交
@@ -0,0 +1,7 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<launchConfiguration type="org.eclipse.ant.AntBuilderLaunchConfigurationType">
|
||||
<booleanAttribute key="org.eclipse.ui.externaltools.ATTR_BUILDER_ENABLED" value="false"/>
|
||||
<stringAttribute key="org.eclipse.ui.externaltools.ATTR_DISABLED_BUILDER" value="org.eclipse.m2e.core.maven2Builder"/>
|
||||
<mapAttribute key="org.eclipse.ui.externaltools.ATTR_TOOL_ARGUMENTS"/>
|
||||
<booleanAttribute key="org.eclipse.ui.externaltools.ATTR_TRIGGERS_CONFIGURED" value="true"/>
|
||||
</launchConfiguration>
|
||||
@@ -0,0 +1,7 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<launchConfiguration type="org.eclipse.ant.AntBuilderLaunchConfigurationType">
|
||||
<booleanAttribute key="org.eclipse.ui.externaltools.ATTR_BUILDER_ENABLED" value="false"/>
|
||||
<stringAttribute key="org.eclipse.ui.externaltools.ATTR_DISABLED_BUILDER" value="org.eclipse.wst.validation.validationbuilder"/>
|
||||
<mapAttribute key="org.eclipse.ui.externaltools.ATTR_TOOL_ARGUMENTS"/>
|
||||
<booleanAttribute key="org.eclipse.ui.externaltools.ATTR_TRIGGERS_CONFIGURED" value="true"/>
|
||||
</launchConfiguration>
|
||||
11
.settings/org.eclipse.wst.xsl.core.prefs
Normal file
@@ -0,0 +1,11 @@
|
||||
CHECK_CALL_TEMPLATES=2
|
||||
CHECK_XPATHS=2
|
||||
CIRCULAR_REF=2
|
||||
DUPLICATE_PARAMETER=2
|
||||
EMPTY_PARAM=1
|
||||
MISSING_INCLUDE=2
|
||||
MISSING_PARAM=1
|
||||
NAME_ATTRIBUTE_EMPTY=2
|
||||
NAME_ATTRIBUTE_MISSING=2
|
||||
TEMPLATE_CONFLICT=2
|
||||
eclipse.preferences.version=1
|
||||
@@ -51,6 +51,8 @@ public class SysMenu extends BaseEntity<SysMenu>{
|
||||
|
||||
private String menuBg;
|
||||
|
||||
private Integer isTop;
|
||||
|
||||
private List<SysMenu> children = new ArrayList<SysMenu>();
|
||||
|
||||
public SysMenu(){
|
||||
@@ -259,5 +261,15 @@ public class SysMenu extends BaseEntity<SysMenu>{
|
||||
public void setCode(String code) {
|
||||
this.code = code;
|
||||
}
|
||||
|
||||
public Integer getIsTop() {
|
||||
return isTop;
|
||||
}
|
||||
|
||||
public void setIsTop(Integer isTop) {
|
||||
this.isTop = isTop;
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
@@ -1,6 +1,7 @@
|
||||
package com.nis.util;
|
||||
|
||||
import java.util.ArrayList;
|
||||
import java.util.Collections;
|
||||
import java.util.List;
|
||||
|
||||
import com.nis.domain.SysMenu;
|
||||
@@ -21,7 +22,6 @@ public final class TreeUtil {
|
||||
|
||||
public List<SysMenu> buildTree(){
|
||||
List<SysMenu> newMenuList = new ArrayList<SysMenu>();
|
||||
|
||||
for (SysMenu menu : menuList) {
|
||||
if (menu.getParent().getId().equals(1l)) {
|
||||
if (isBusinessOfAdmin(menu.getName())) {
|
||||
@@ -35,6 +35,21 @@ public final class TreeUtil {
|
||||
return newMenuList;
|
||||
}
|
||||
|
||||
public List<SysMenu> buildTreeLeft(){
|
||||
List<SysMenu> newMenuList = new ArrayList<SysMenu>();
|
||||
for (SysMenu menu : menuList) {
|
||||
if (menu.getIsTop().equals(1)) {
|
||||
if (isBusinessOfAdmin(menu.getName())) {
|
||||
continue;
|
||||
}
|
||||
build(menu);
|
||||
newMenuList.add(menu);
|
||||
}
|
||||
}
|
||||
|
||||
return newMenuList;
|
||||
}
|
||||
|
||||
/**
|
||||
* 过滤admin的业务功能
|
||||
* @return
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
package com.nis.web.controller.configuration;
|
||||
|
||||
import org.springframework.stereotype.Controller;
|
||||
import org.springframework.web.bind.annotation.RequestMapping;
|
||||
|
||||
/**
|
||||
* IP相关配置控制类
|
||||
@@ -8,6 +9,31 @@ import org.springframework.stereotype.Controller;
|
||||
*
|
||||
*/
|
||||
@Controller
|
||||
@RequestMapping("${adminPath}/cfg/ip")
|
||||
public class IpCfgController {
|
||||
|
||||
|
||||
@RequestMapping(value = {"ipWhiteList"})
|
||||
public String ipWhiteList() {
|
||||
return "/cfg/ipWhiteList";
|
||||
}
|
||||
|
||||
|
||||
@RequestMapping(value = {"ipWhiteForm"})
|
||||
public String ipWhiteForm() {
|
||||
return "/cfg/ipWhiteForm";
|
||||
}
|
||||
|
||||
|
||||
@RequestMapping(value = {"ipBlockList"})
|
||||
public String ipBlockList() {
|
||||
return "/cfg/ipBlockList";
|
||||
}
|
||||
|
||||
|
||||
@RequestMapping(value = {"ipBlockForm"})
|
||||
public String ipBlockForm() {
|
||||
return "/cfg/ipBlockForm";
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -0,0 +1,30 @@
|
||||
package com.nis.web.controller.configuration;
|
||||
|
||||
import org.springframework.stereotype.Controller;
|
||||
import org.springframework.web.bind.annotation.RequestMapping;
|
||||
|
||||
import com.nis.web.controller.BaseController;
|
||||
|
||||
/**
|
||||
* 测试类
|
||||
*
|
||||
*/
|
||||
@Controller
|
||||
@RequestMapping("${adminPath}/cfg/request")
|
||||
public class RequestInfoController extends BaseController{
|
||||
|
||||
|
||||
@RequestMapping(value = {"list"})
|
||||
public String list() {
|
||||
return "/cfg/requestList";
|
||||
}
|
||||
|
||||
|
||||
@RequestMapping(value = {"form"})
|
||||
public String form() {
|
||||
return "/cfg/requestForm";
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
@@ -22,7 +22,9 @@
|
||||
a.del_flag,
|
||||
a.quick_action,
|
||||
a.menu_bg,
|
||||
p.name AS "parent.name"
|
||||
p.name AS "parent.name",
|
||||
a.is_top
|
||||
|
||||
</sql>
|
||||
|
||||
<sql id="menuJoins">
|
||||
@@ -42,7 +44,7 @@
|
||||
<include refid="menuColumns"/>
|
||||
FROM sys_menu a
|
||||
<include refid="menuJoins"/>
|
||||
WHERE a.del_flag = #{DEL_FLAG_NORMAL}
|
||||
WHERE a.del_flag = #{DEL_FLAG_NORMAL}
|
||||
ORDER BY a.sort
|
||||
</select>
|
||||
|
||||
@@ -82,7 +84,8 @@
|
||||
update_by,
|
||||
update_date,
|
||||
remarks,
|
||||
del_flag
|
||||
del_flag,
|
||||
is_top
|
||||
) VALUES (
|
||||
#{parent.id},
|
||||
#{parentIds},
|
||||
@@ -99,7 +102,8 @@
|
||||
#{updateBy.id},
|
||||
#{updateDate},
|
||||
#{remarks},
|
||||
#{delFlag}
|
||||
#{delFlag},
|
||||
#{isTop}
|
||||
)
|
||||
</insert>
|
||||
|
||||
@@ -117,7 +121,8 @@
|
||||
permission = #{permission},
|
||||
update_by = #{updateBy.id},
|
||||
update_date = #{updateDate},
|
||||
remarks = #{remarks}
|
||||
remarks = #{remarks},
|
||||
is_top = #{isTop}
|
||||
WHERE id = #{id}
|
||||
</update>
|
||||
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
package com.nis.web.security;
|
||||
|
||||
import java.util.ArrayList;
|
||||
import java.util.HashMap;
|
||||
import java.util.List;
|
||||
import java.util.Map;
|
||||
@@ -207,6 +208,23 @@ public class UserUtils {
|
||||
return new TreeUtil(getMenuList()).buildTree();
|
||||
}
|
||||
|
||||
/**
|
||||
* 按照菜单各级递归排列-左侧菜单
|
||||
* @return
|
||||
*/
|
||||
public static List<SysMenu> getLeftMenuTreeList(){
|
||||
|
||||
List<SysMenu> newMenuList = new TreeUtil(getMenuList()).buildTreeLeft();
|
||||
/* for (SysMenu menu : newMenuList) {
|
||||
menu.getChildren();
|
||||
|
||||
}*/
|
||||
|
||||
return newMenuList;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
71
src/main/webapp/WEB-INF/include/form/basicInfo.jsp
Normal file
@@ -0,0 +1,71 @@
|
||||
<%@ page contentType="text/html;charset=UTF-8"%>
|
||||
<%@ include file="/WEB-INF/include/taglib.jsp"%>
|
||||
<h3 class="form-section">基本配置</h3>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-3">来函函号</label>
|
||||
<div class="col-md-8">
|
||||
<select class="form-control">
|
||||
<option>Country 1</option>
|
||||
<option>Country 2</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/span-->
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-3">专项任务</label>
|
||||
<div class="col-md-8">
|
||||
<select class="form-control">
|
||||
<option>Country 1</option>
|
||||
<option>Country 2</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/span-->
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-3">分类性质</label>
|
||||
<div class="col-md-8">
|
||||
<select class="form-control">
|
||||
<option>Country 1</option>
|
||||
<option>Country 2</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-3">标签</label>
|
||||
<div class="col-md-8">
|
||||
<select class="form-control">
|
||||
<option>Country 1</option>
|
||||
<option>Country 2</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- <div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-3">生效范围</label>
|
||||
<div class="col-md-8">
|
||||
<select class="form-control">
|
||||
<option>Country 1</option>
|
||||
<option>Country 2</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div> -->
|
||||
62
src/main/webapp/WEB-INF/include/form/ip6T.jsp
Normal file
@@ -0,0 +1,62 @@
|
||||
<%@ page contentType="text/html;charset=UTF-8"%>
|
||||
<%@ include file="/WEB-INF/include/taglib.jsp"%>
|
||||
<h3 class="form-section">管控配置</h3>
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-3">源IP地址</label>
|
||||
<div class="col-md-8">
|
||||
<input class="form-control" type="text">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6">
|
||||
<div class="form-group ">
|
||||
<label class="control-label col-md-3">目的IP地址</label>
|
||||
<div class="col-md-8">
|
||||
<input class="form-control" type="text">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-3">源掩码</label>
|
||||
<div class="col-md-8">
|
||||
<input class="form-control" type="text">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6">
|
||||
<div class="form-group ">
|
||||
<label class="control-label col-md-3">目的掩码</label>
|
||||
<div class="col-md-8">
|
||||
<input class="form-control" type="text">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-3">源端口</label>
|
||||
<div class="col-md-8">
|
||||
<input class="form-control" type="text">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6">
|
||||
<div class="form-group ">
|
||||
<label class="control-label col-md-3">目的端口</label>
|
||||
<div class="col-md-8">
|
||||
<input class="form-control" type="text">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
24
src/main/webapp/WEB-INF/include/form/ipInfo.jsp
Normal file
@@ -0,0 +1,24 @@
|
||||
<%@ page contentType="text/html;charset=UTF-8"%>
|
||||
<%@ include file="/WEB-INF/include/taglib.jsp"%>
|
||||
<h3 class="form-section">管控配置</h3>
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-3">IP地址</label>
|
||||
<div class="col-md-8">
|
||||
<input class="form-control" type="text">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/span-->
|
||||
<div class="col-md-6">
|
||||
<div class="form-group ">
|
||||
<label class="control-label col-md-3">配置名称</label>
|
||||
<div class="col-md-8">
|
||||
<input class="form-control" type="text">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--/span-->
|
||||
</div>
|
||||
<!--/row-->
|
||||
@@ -4,31 +4,57 @@
|
||||
<meta name="renderer" content="webkit"><meta http-equiv="X-UA-Compatible" content="IE=8,IE=9,IE=10" />
|
||||
<meta http-equiv="Expires" content="0"><meta http-equiv="Cache-Control" content="no-cache"><meta http-equiv="Cache-Control" content="no-store">
|
||||
|
||||
<script src="${pageContext.request.contextPath }/static/jquery/jquery-1.8.3.min.js" type="text/javascript"></script>
|
||||
<link href="${pageContext.request.contextPath }/static/bootstrap/2.3.1/css_${not empty cookie.theme.value ? cookie.theme.value : 'cerulean'}/bootstrap.css" type="text/css" rel="stylesheet" />
|
||||
<script src="${pageContext.request.contextPath }/static/bootstrap/2.3.1/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<link href="${pageContext.request.contextPath }/static/bootstrap/2.3.1/awesome/font-awesome.min.css" type="text/css" rel="stylesheet" />
|
||||
<script src="${pageContext.request.contextPath }/static/bootstrap/2.3.1/docs/assets/js/bootstrap-tooltip.js" type="text/javascript"></script>
|
||||
<script src="${pageContext.request.contextPath }/static/bootstrap/2.3.1/docs/assets/js/bootstrap-popover.js" type="text/javascript"></script>
|
||||
|
||||
<!--[if lte IE 7]><link href="${pageContext.request.contextPath }/static/bootstrap/2.3.1/awesome/font-awesome-ie7.min.css" type="text/css" rel="stylesheet" /><![endif]-->
|
||||
<!--[if lte IE 6]><link href="${pageContext.request.contextPath }/static/bootstrap/bsie/css/bootstrap-ie6.min.css" type="text/css" rel="stylesheet" />
|
||||
<script src="${pageContext.request.contextPath }/static/bootstrap/bsie/js/bootstrap-ie.min.js" type="text/javascript"></script><![endif]-->
|
||||
<link href="${pageContext.request.contextPath }/static/jquery-select2/3.4/select2.min.css" rel="stylesheet" />
|
||||
<script src="${pageContext.request.contextPath }/static/jquery-select2/3.4/select2.min.js" type="text/javascript"></script>
|
||||
<link href="${pageContext.request.contextPath }/static/jquery-validation/1.11.0/jquery.validate.min.css" type="text/css" rel="stylesheet" />
|
||||
<script src="${pageContext.request.contextPath }/static/jquery-validation/1.11.0/jquery.validate.min.js" type="text/javascript"></script>
|
||||
<link href="${pageContext.request.contextPath }/static/jquery-jbox/2.3/Skins/Bootstrap/jbox.min.css" rel="stylesheet" />
|
||||
<script src="${pageContext.request.contextPath }/static/jquery-jbox/2.3/jquery.jBox-2.3.min.js" type="text/javascript"></script>
|
||||
<script src="${pageContext.request.contextPath }/static/My97DatePicker/WdatePicker.js" type="text/javascript"></script>
|
||||
<link href="${pageContext.request.contextPath }/static/common/pricing-tables.css" type="text/css" rel="stylesheet" />
|
||||
<script src="${pageContext.request.contextPath }/static/common/jquery.cookie.js" type="text/javascript"></script>
|
||||
<script src="${pageContext.request.contextPath }/static/common/mustache.min.js" type="text/javascript"></script>
|
||||
<link href="${pageContext.request.contextPath }/static/common/jeesite.css" type="text/css" rel="stylesheet" />
|
||||
<script src="${pageContext.request.contextPath }/static/common/jeesite.js" type="text/javascript"></script>
|
||||
<link href="${pageContext.request.contextPath }/static/jquery-plugin/jquery.autocomplete.css" type="text/css" rel="stylesheet" />
|
||||
<script src="${pageContext.request.contextPath }/static/jquery-plugin/jquery.autocomplete.js" type="text/javascript"></script>
|
||||
<script src="${pageContext.request.contextPath }/static/common/unicodes.js" type="text/javascript"></script>
|
||||
<link href="${pageContext.request.contextPath}/static/global/plugins/font-awesome/css/font-awesome.css" rel="stylesheet" type="text/css" />
|
||||
<link href="${pageContext.request.contextPath}/static/global/plugins/simple-line-icons/simple-line-icons.css" rel="stylesheet" type="text/css" />
|
||||
<link href="${pageContext.request.contextPath}/static/global/plugins/bootstrap/css/bootstrap.css" rel="stylesheet" type="text/css" />
|
||||
<link href="${pageContext.request.contextPath}/static/global/plugins/bootstrap-switch/css/bootstrap-switch.css" rel="stylesheet" type="text/css" />
|
||||
<!-- END GLOBAL MANDATORY STYLES -->
|
||||
<!-- BEGIN PAGE LEVEL PLUGINS -->
|
||||
|
||||
<link href="${pageContext.request.contextPath}/static/global/plugins/jquery-validation/1.11.0/jquery.validate.min.css" type="text/css" rel="stylesheet" />
|
||||
<link href="${pageContext.request.contextPath }/static/global/plugins/jquery-jbox/2.3/Skins/Bootstrap/jbox.min.css" rel="stylesheet" />
|
||||
<!-- END PAGE LEVEL PLUGINS -->
|
||||
|
||||
<!-- BEGIN THEME GLOBAL STYLES -->
|
||||
<link href="${pageContext.request.contextPath}/static/global/css/components.css" rel="stylesheet" id="style_components" type="text/css" />
|
||||
<link href="${pageContext.request.contextPath}/static/global/css/plugins.css" rel="stylesheet" type="text/css" />
|
||||
<!-- END THEME GLOBAL STYLES -->
|
||||
|
||||
<!-- BEGIN THEME LAYOUT STYLES -->
|
||||
<link href="${pageContext.request.contextPath}/static/layouts/layout/css/layout.css" rel="stylesheet" type="text/css" />
|
||||
<link href="${pageContext.request.contextPath}/static/layouts/layout/css/themes/default.css" rel="stylesheet" type="text/css" id="style_color" />
|
||||
<link href="${pageContext.request.contextPath}/static/layouts/layout/css/custom.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
|
||||
<!--[if lt IE 9]>
|
||||
<script src="${pageContext.request.contextPath}/static/global/plugins/respond.min.js"></script>
|
||||
<script src="${pageContext.request.contextPath}/static/global/plugins/excanvas.min.js"></script>
|
||||
<![endif]-->
|
||||
<!-- BEGIN CORE PLUGINS -->
|
||||
<script src="${pageContext.request.contextPath}/static/global/plugins/jquery.min.js" type="text/javascript"></script>
|
||||
<script src="${pageContext.request.contextPath}/static/global/plugins/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<script src="${pageContext.request.contextPath}/static/global/plugins/js.cookie.min.js" type="text/javascript"></script>
|
||||
<script src="${pageContext.request.contextPath}/static/global/plugins/bootstrap-hover-dropdown/bootstrap-hover-dropdown.min.js" type="text/javascript"></script>
|
||||
<script src="${pageContext.request.contextPath}/static/global/plugins/jquery-slimscroll/jquery.slimscroll.min.js" type="text/javascript"></script>
|
||||
<script src="${pageContext.request.contextPath}/static/global/plugins/jquery.blockui.min.js" type="text/javascript"></script>
|
||||
<script src="${pageContext.request.contextPath}/static/global/plugins/bootstrap-switch/js/bootstrap-switch.min.js" type="text/javascript"></script>
|
||||
|
||||
<script src="${pageContext.request.contextPath}/static/global/plugins/jquery-validation/1.11.0/jquery.validate.min.js" type="text/javascript"></script>
|
||||
<script src="${pageContext.request.contextPath}/static/global/plugins/jquery-validation/1.11.0/jquery.validate.method.js" type="text/javascript"></script>
|
||||
|
||||
<script src="${pageContext.request.contextPath}/static/global/plugins/jquery-jbox/2.3/jquery.jBox-2.3.min.js" type="text/javascript"></script>
|
||||
<script src="${pageContext.request.contextPath}/static/global/plugins/My97DatePicker/WdatePicker.js" type="text/javascript"></script>
|
||||
<!-- END CORE PLUGINS -->
|
||||
|
||||
|
||||
<!-- BEGIN THEME GLOBAL SCRIPTS -->
|
||||
<script src="${pageContext.request.contextPath}/static/global/scripts/app.min.js" type="text/javascript"></script>
|
||||
<!-- END THEME GLOBAL SCRIPTS -->
|
||||
|
||||
|
||||
<!-- BEGIN THEME LAYOUT SCRIPTS -->
|
||||
<script src="${pageContext.request.contextPath}/static/layouts/layout/scripts/layout.js" type="text/javascript"></script>
|
||||
<!-- END THEME LAYOUT SCRIPTS -->
|
||||
|
||||
|
||||
<link href="${pageContext.request.contextPath }/static/jquery-toastr/toastr.min.css" type="text/css" rel="stylesheet" />
|
||||
<script src="${pageContext.request.contextPath }/static/jquery-toastr/toastr.min.js" type="text/javascript"></script>
|
||||
|
||||
89
src/main/webapp/WEB-INF/include/left_menu.jsp
Normal file
@@ -0,0 +1,89 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@ include file="/WEB-INF/include/taglib.jsp"%>
|
||||
|
||||
|
||||
|
||||
<c:forEach items="${fns:getLeftMenuTreeList()}" var="menu" varStatus="idxStatus">
|
||||
|
||||
<ul id="menu_${menu.id }" class="hide accordion page-sidebar-menu page-header-fixed page-sidebar-menu-light"
|
||||
data-keep-expanded="false" data-auto-scroll="true" data-slide-speed="200">
|
||||
|
||||
<c:if test="${not empty menu.children }">
|
||||
<c:forEach items="${menu.children}" var="secondMenu" varStatus="secondStatus">
|
||||
|
||||
<li class="nav-item <c:if test="${secondStatus.index==0 }"> active open</c:if>">
|
||||
|
||||
<a class="nav-link nav-toggle"
|
||||
|
||||
<c:if test="${secondMenu.href != null && secondMenu.href != ''}" var="secondHref">
|
||||
href="${ctx}/${secondMenu.href }" target="mainFrame" >
|
||||
</c:if>
|
||||
<c:if test="${!secondHref }">
|
||||
href="javascript:;" class="nav-link nav-toggle">
|
||||
</c:if>
|
||||
|
||||
<i class="${secondMenu.icon }"></i>
|
||||
<span class="title"> ${secondMenu.name } <%-- <spring:message code="${secondMenu.code}"></spring:message> --%></span>
|
||||
<c:if test="${not empty secondMenu.children }" var="secondClid">
|
||||
<span class="arrow open"></span>
|
||||
</c:if>
|
||||
</a>
|
||||
|
||||
|
||||
<c:if test="${secondClid}">
|
||||
<ul class="sub-menu">
|
||||
|
||||
<c:forEach items="${secondMenu.children}" var="thirdMenu" varStatus="thirdStatus">
|
||||
|
||||
|
||||
<li class="nav-item <c:if test="${not empty thirdMenu.children && thirdStatus.index==0}">active open</c:if>">
|
||||
|
||||
<a class="nav-link nav-toggle"
|
||||
|
||||
<c:if test="${thirdMenu.href != null && thirdMenu.href != ''}" var="thirdHref">
|
||||
href="${ctx}/${thirdMenu.href }" target="mainFrame" >
|
||||
</c:if>
|
||||
<c:if test="${!thirdHref }">
|
||||
href="javascript:;" class="nav-link nav-toggle">
|
||||
</c:if>
|
||||
|
||||
<span class="title">${thirdMenu.name } <%-- <spring:message code="${thirdMenu.code}"></spring:message> --%></span>
|
||||
<c:if test="${not empty thirdMenu.children }" var="thiredClid">
|
||||
<span class="arrow open"></span>
|
||||
</c:if>
|
||||
</a>
|
||||
|
||||
<c:if test="${thiredClid}">
|
||||
<ul class="sub-menu">
|
||||
<c:forEach items="${thirdMenu.children}" var="fourthMenu">
|
||||
<li class="nav-item">
|
||||
<a href="${ctx}/${fourthMenu.href }" target="mainFrame" class="nav-link ">
|
||||
${fourthMenu.name } <%-- <spring:message code="${fourthMenu.code}"></spring:message> --%>
|
||||
<!-- <span class="badge badge-danger">1</span> -->
|
||||
</a>
|
||||
</li>
|
||||
|
||||
</c:forEach>
|
||||
</ul>
|
||||
</c:if>
|
||||
</li>
|
||||
|
||||
</c:forEach>
|
||||
</ul>
|
||||
</c:if>
|
||||
|
||||
|
||||
</li>
|
||||
|
||||
</c:forEach>
|
||||
|
||||
</c:if>
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
</c:forEach>
|
||||
|
||||
|
||||
@@ -70,6 +70,14 @@
|
||||
<example>${fns:getMenuTreeList()}</example>
|
||||
</function>
|
||||
|
||||
<function>
|
||||
<description>获取当前用户的左侧菜单树对象列表</description>
|
||||
<name>getLeftMenuTreeList</name>
|
||||
<function-class>com.nis.web.security.UserUtils</function-class>
|
||||
<function-signature>java.util.List getLeftMenuTreeList()</function-signature>
|
||||
<example>${fns:getLeftMenuTreeList()}</example>
|
||||
</function>
|
||||
|
||||
<function>
|
||||
<description>获取当前用户的区域对象列表</description>
|
||||
<name>getAreaList</name>
|
||||
|
||||
633
src/main/webapp/WEB-INF/views/!home.jsp
Normal file
@@ -0,0 +1,633 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@ include file="/WEB-INF/include/taglib.jsp"%>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<c:set var="tabmode" value="${empty cookie.tabmode.value ? '1' : cookie.tabmode.value}"/>
|
||||
<c:set var="workNotifyRemindInterval" value="${fns:getStringProperty('work.notify.remind.interval','')}"/>
|
||||
<c:if test="${tabmode eq '1'}">
|
||||
<link rel="Stylesheet" href="${pageContext.request.contextPath}/static/jerichotab/css/jquery.jerichotab.css" />
|
||||
<script type="text/javascript" src="${pageContext.request.contextPath}/static/jerichotab/js/jquery.jerichotab.js"></script>
|
||||
</c:if>
|
||||
<link rel="shortcut icon" href="${pageContext.request.contextPath}/static/images/mvc_frame.ico"/>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<title>${fns:getStringProperty('productName','NIS')}</title>
|
||||
|
||||
<style type="text/css">
|
||||
h3{color:#ffffff;margin:30px 0px 0px 10px;}
|
||||
</style>
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<div id="main">
|
||||
<!-- header -->
|
||||
<div id="header" class="navbar navbar-fixed-top">
|
||||
<div class="navbar-inner">
|
||||
<div class="topleft">
|
||||
<a href="${pageContext.request.contextPath}/" target="_parent">
|
||||
<h3>National Firewall System</h3></a>
|
||||
</div>
|
||||
<ul class="topnav">
|
||||
<c:forEach items="${fns:getMenuTreeList()}" var="menu" varStatus="idxStatus">
|
||||
|
||||
<c:if test="${menu.parent.id eq 1 && menu.isShow eq 1}">
|
||||
|
||||
|
||||
<c:if test="${menu.href != null && menu.href != ''}" var="leafNodeFlag">
|
||||
<li>
|
||||
<a href="${ctx}${menu.href}" id="${menu.id}" target="mainFrame" class="${idxStatus.index eq 0 ? 'selected' : ''}">
|
||||
<img src="${ctxStatic}/images/${menu.icon}.png" title="<spring:message code="${menu.code}"></spring:message>" />
|
||||
<h2><%-- ${menu.name } --%><spring:message code="${menu.code}"></spring:message></h2>
|
||||
</a>
|
||||
</li>
|
||||
</c:if>
|
||||
|
||||
<c:if test="${!leafNodeFlag }">
|
||||
<li>
|
||||
<a href="javascript:void(0);" id="${menu.id}" class="${idxStatus.index eq 0 ? 'selected' : ''}">
|
||||
<img src="${ctxStatic}/images/${menu.icon}.png" title="<spring:message code="${menu.code}"></spring:message>" />
|
||||
<h2><%-- ${menu.name} --%>
|
||||
<spring:message code="${menu.code}"></spring:message>
|
||||
</h2>
|
||||
</a>
|
||||
</li>
|
||||
</c:if>
|
||||
|
||||
|
||||
|
||||
</c:if>
|
||||
|
||||
|
||||
</c:forEach>
|
||||
</ul>
|
||||
|
||||
<div class="topright">
|
||||
<ul>
|
||||
<li><a href="${pageContext.request.contextPath}/" title="访问网站主页"><i class="icon-home"></i><spring:message code="home"></spring:message></a></li>
|
||||
<li><a href="#"><i class="icon-question-sign"></i> <spring:message code="help"></spring:message></a></li>
|
||||
<li><a href="${pageContext.request.contextPath }/logout" title="退出登录"><i class="icon-signout"></i> <spring:message code="exit"></spring:message></a></li>
|
||||
</ul>
|
||||
|
||||
<div class="user">
|
||||
|
||||
<ul class="nav pull-right">
|
||||
<li id="userInfo" class="dropdown">
|
||||
<a class="dropdown-toggle" data-toggle="dropdown" href="#" title="个人信息"><i class="icon-user"></i> <spring:message code="hi"></spring:message>,${fns:getUser().name} <span id="notifyNum" class="label label-info hide"></span><b class="caret"></b></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="${ctx}/sys/user/info" target="mainFrame"><i class="icon-user"></i> <spring:message code="userInfo"></spring:message></a></li>
|
||||
<li><a href="${ctx}/sys/user/modifyPwd" target="mainFrame"><i class="icon-lock"></i> <spring:message code="updatePwd"></spring:message></a></li>
|
||||
<li><a href="${ctx}oa/oaNotify/self" target="mainFrame"><i class="icon-bell"></i> <spring:message code="notify"></spring:message> <span id="notifyNum2" class="label label-info hide"></span></a></li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<li id="themeSwitch" class="dropdown">
|
||||
<a class="dropdown-toggle" data-toggle="dropdown" href="#" title="主题切换"><i class="icon-th-large"></i> <b class="caret"></b></a>
|
||||
<ul class="dropdown-menu">
|
||||
<c:forEach items="${fns:getDictList('SYS_THEME')}" var="dict">
|
||||
<li <c:if test="${cookie.theme.value eq dict.itemCode}">class='active'</c:if>>
|
||||
<a href="#" onclick="location='${pageContext.request.contextPath}/theme/${dict.itemCode}?url='+location.href">${dict.itemValue}</a>
|
||||
</li>
|
||||
</c:forEach>
|
||||
|
||||
<li><a href="javascript:cookie('tabmode','${tabmode eq '1' ? '0' : '1'}');location=location.href">${tabmode eq '1' ? '关闭' : '开启'}页签模式</a></li>
|
||||
<li><a href="${pageContext.request.contextPath}/language?language=en">英语</a></li>
|
||||
<li><a href="${pageContext.request.contextPath}/language?language=zh_CN">中文</a></li>
|
||||
<li><a href="${pageContext.request.contextPath}/language?language=ru">俄文</a></li>
|
||||
</ul>
|
||||
<!--[if lte IE 6]><script type="text/javascript">$('#themeSwitch').hide();</script><![endif]-->
|
||||
</li>
|
||||
|
||||
<li><a href="javascript:void(0);" class="tip-bottom" title="显示/隐藏快捷菜单"><i id="show-hide-option" class="icon-eye-open"></i></a></li>
|
||||
|
||||
</ul>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- main content -->
|
||||
<div class="container-fluid">
|
||||
<div id="content" class="row-fluid">
|
||||
<div id="left">
|
||||
<!-- sidebar -->
|
||||
<c:forEach items="${fns:getMenuTreeList()}" var="menu" varStatus="idxStatus">
|
||||
<c:if test="${not empty menu.children }">
|
||||
|
||||
<div id="menu-${menu.id }" class="accordion ${idxStatus.index eq 0 ? '' : 'hide'}">
|
||||
<div class="lefttop"><span></span><%-- ${menu.name } --%>
|
||||
<spring:message code="${menu.code}"></spring:message></div>
|
||||
<dl class="leftmenu">
|
||||
<%-- <dd><div id="menu-0-0" class="title"><i class="icon-check" ></i>
|
||||
<a id="menu-81-70" data-id="70" data-name="国际化" href="${pageContext.request.contextPath}/something" target="mainFrame" jerichotabindex="0">示例</a>
|
||||
</div>
|
||||
</dd> --%>
|
||||
<c:forEach items="${menu.children}" var="secondMenu">
|
||||
<dd>
|
||||
<div id="menu-${menu.id }-${secondMenu.id}" class="title">
|
||||
<img src="${ctxStatic}/images/${secondMenu.icon}.png" title="${secondMenu.name }"/>
|
||||
<%-- <span class="${secondMenu.icon } icon-white"></span> --%>
|
||||
<%-- ${secondMenu.name} --%>
|
||||
<spring:message code="${secondMenu.code}"></spring:message>
|
||||
</div>
|
||||
<ul class="menuson">
|
||||
|
||||
|
||||
<c:forEach items="${secondMenu.children}" var="thirdMenu" varStatus="thirdIdxStatus">
|
||||
<c:if test="${thirdMenu.href != null && thirdMenu.href != '' }">
|
||||
|
||||
<li>
|
||||
<span class="${not empty thirdMenu.icon?thirdMenu.icon:'icon-hide'} icon-white"></span>
|
||||
<a id="menu-${menu.id }-${secondMenu.id}-${thirdMenu.id}" data-id="${thirdMenu.id}" data-name="${menu.name }-${secondMenu.name}-${thirdMenu.name}"
|
||||
href="${ctx}${thirdMenu.href}" target="mainFrame">
|
||||
<%-- ${thirdMenu.name } --%>
|
||||
<spring:message code="${thirdMenu.code}"></spring:message>
|
||||
<i></i></a>
|
||||
</li>
|
||||
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</ul>
|
||||
|
||||
|
||||
</dd>
|
||||
|
||||
|
||||
|
||||
</c:forEach>
|
||||
|
||||
</dl>
|
||||
|
||||
</div>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div id="openClose" class="close"> </div>
|
||||
|
||||
<div id="right">
|
||||
<div class="quick-actions_homepage">
|
||||
<div id="quickMenu">
|
||||
<ul class="quick-actions">
|
||||
|
||||
<!-- <li class="bg_lb"> <a href="javascript:void(0);" onclick="go_home()"> <i class="icon-check"></i> 待办事项</a> </li> -->
|
||||
|
||||
<c:forEach items="${fns:getMenuTreeList()}" var="menu" varStatus="idxStatus">
|
||||
<c:if test="${not empty menu.children }">
|
||||
<c:forEach items="${menu.children}" var="secondMenu">
|
||||
|
||||
<c:if test="${not empty secondMenu.href and secondMenu.quickAction ne 0}">
|
||||
<c:if test="${secondMenu.quickAction==1}">
|
||||
<li class="${secondMenu.menuBg }">
|
||||
<a href="javascript:void(0);" onclick="page_turn('${menu.id}'+'_'+'${secondMenu.id}')"> <i class="${secondMenu.icon }"></i>
|
||||
<%-- ${secondMenu.name } --%>
|
||||
<spring:message code="${secondMenu.code}"></spring:message>
|
||||
<c:if test="${secondMenu.name eq '待办事项'}"><span id="notifyWorkedOption" class="label label-important hide"></span></c:if>
|
||||
</a>
|
||||
</li>
|
||||
</c:if>
|
||||
|
||||
<c:if test="${secondMenu.quickAction==2}">
|
||||
<li class="${secondMenu.menuBg } span3"> <a href="javascript:void(0);" onclick="page_turn('${menu.id}'+'_'+'${secondMenu.id}')">
|
||||
<i class="${secondMenu.icon }"></i>
|
||||
<%-- ${secondMenu.name } --%>
|
||||
<spring:message code="${secondMenu.code}"></spring:message>
|
||||
<c:if test="${secondMenu.name eq '待办事项'}"><span id="notifyWorkedOption" class="label label-important hide"></span></c:if></a> </li>
|
||||
</c:if>
|
||||
</c:if>
|
||||
|
||||
<c:forEach items="${secondMenu.children}" var="thirdMenu">
|
||||
<c:if test="${not empty thirdMenu.href and thirdMenu.quickAction ne 0}">
|
||||
<c:if test="${thirdMenu.quickAction==1}">
|
||||
<li class="${thirdMenu.menuBg }">
|
||||
<a href="javascript:void(0);" onclick="page_turn('${menu.id}'+'_'+'${secondMenu.id}'+'_'+'${thirdMenu.id}')">
|
||||
<i class="${thirdMenu.icon }"></i><%-- ${thirdMenu.name } --%>
|
||||
<spring:message code="${thirdMenu.code}"></spring:message>
|
||||
<c:if test="${thirdMenu.name eq '待办事项'}"><span id="notifyWorkedOption" class="label label-important hide"></span></c:if>
|
||||
</a>
|
||||
</li>
|
||||
</c:if>
|
||||
|
||||
<c:if test="${thirdMenu.quickAction==2}">
|
||||
<li class="${thirdMenu.menuBg } span3">
|
||||
<a href="javascript:void(0);" onclick="page_turn('${menu.id}'+'_'+'${secondMenu.id}'+'_'+'${thirdMenu.id}')"> <i class="${thirdMenu.icon }"></i>
|
||||
<%-- ${thirdMenu.name } --%>
|
||||
<spring:message code="${thirdMenu.code}"></spring:message>
|
||||
<c:if test="${thirdMenu.name eq '待办事项'}"><span id="notifyWorkedOption" class="label label-important hide"></span></c:if>
|
||||
</a>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:if>
|
||||
|
||||
</c:forEach>
|
||||
|
||||
|
||||
|
||||
</c:forEach>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<%-- <div class="place">
|
||||
<span><i class="icon-home"></i> </span>
|
||||
<ul class="placeul">
|
||||
<li><a href="${pageContext.request.contextPath}/" >首页</a></li>
|
||||
<li><a href="javascript:void(0);" >首页</a></li>
|
||||
</ul>
|
||||
</div> --%>
|
||||
<iframe id="mainFrame" name="mainFrame" src="" style="overflow:visible;" scrolling="yes" frameborder="no" width="100%">
|
||||
浏览器不支持嵌入式框架或配置为不显示嵌入式框架。
|
||||
</iframe>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div id="footer" class="row-fluid">
|
||||
Copyright © 2015-${fns:getStringProperty('copyrightYear','2015')} ${fns:getStringProperty('productName','NIS')} - Powered By <a href="${pageContext.request.contextPath }" target="_blank">NIS</a> ${fns:getStringProperty('version','1.0')}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
|
||||
$(document).ready(function(){
|
||||
App.init();
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
function page_turn(ids) {
|
||||
var ids = ids.split("_");
|
||||
$("#"+ids[0]).click();
|
||||
|
||||
|
||||
|
||||
var $secondMenu = $("#menu-"+ids[0]+"-"+ids[1]).siblings(".menuson");
|
||||
|
||||
if ($secondMenu.is(':hidden')){
|
||||
$("#menu-"+ids[0]+"-"+ids[1]).click();
|
||||
}
|
||||
|
||||
var $thirdMenu = $("#menu-"+ids[0]+"-"+ids[1]+"-"+ids[2]);
|
||||
|
||||
if (!$thirdMenu.parent().hasClass("active")) {
|
||||
$thirdMenu.children("i").click();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
var App = function() {
|
||||
|
||||
var leftWidth = 190; // 左侧窗口大小
|
||||
var tabTitleHeight = 33; // 页签的高度
|
||||
var htmlObj = $("html"), mainObj = $("#main");
|
||||
var headerObj = $("#header"), footerObj = $("#footer");
|
||||
var centerObj = $("#left, #openClose, #right");
|
||||
var frameObj = $("#right iframe");
|
||||
var quickObj = $("#right .quick-actions_homepage");
|
||||
|
||||
var handleResponsiveOnResize = function(){
|
||||
|
||||
$("#left").width(leftWidth);
|
||||
|
||||
$("#openClose").click(function(){
|
||||
if($(this).hasClass("close")){
|
||||
|
||||
$(this).removeClass("close").addClass("open");
|
||||
|
||||
$("#left").animate({width:0,opacity:"hide"});
|
||||
|
||||
$("#right").animate({width:$("#content").width()-$("#openClose").width()-5},function(){
|
||||
if(typeof openCloseClickCallBack=="function"){
|
||||
openCloseClickCallBack(true);
|
||||
}
|
||||
wSize();
|
||||
}
|
||||
)
|
||||
} else {
|
||||
$(this).removeClass("open").addClass("close");
|
||||
|
||||
$("#left").animate({width:leftWidth,opacity:"show"});
|
||||
|
||||
$("#right").animate({width:$("#content").width()-$("#openClose").width()-leftWidth-9},function(){
|
||||
if(typeof openCloseClickCallBack=="function"){
|
||||
openCloseClickCallBack(true);
|
||||
}
|
||||
wSize();
|
||||
}
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
if(!Array.prototype.map){
|
||||
Array.prototype.map=function(e,d){
|
||||
var a=[],b=0;
|
||||
for(var c=0,f=this.length;c<f;c++){
|
||||
if(c in this){
|
||||
a[b++]=e.call(d,this[c],c,this)
|
||||
}
|
||||
}
|
||||
return a;
|
||||
}
|
||||
}
|
||||
|
||||
$(window).resize(function(){wSize()});
|
||||
|
||||
wSize();
|
||||
}
|
||||
|
||||
|
||||
<c:if test="${tabmode eq '1'}">
|
||||
var openCloseClickCallBack = function(b){
|
||||
$.fn.jerichoTab.resize();
|
||||
}
|
||||
</c:if>
|
||||
|
||||
|
||||
var getWindowSize = function(){
|
||||
return["Height","Width"].map(function(a){
|
||||
return window["inner"+a]||document.compatMode==="CSS1Compat"&&document.documentElement["client"+a]||document.body["client"+a]});
|
||||
}
|
||||
|
||||
//主界面自适应大小
|
||||
var wSize = function(){
|
||||
var minHeight = 500, minWidth = 980;
|
||||
var strs = getWindowSize().toString().split(",");
|
||||
|
||||
htmlObj.css({"overflow-x":strs[1] < minWidth ? "auto" : "hidden", "overflow-y":strs[0] < minHeight ? "auto" : "hidden"});
|
||||
mainObj.css("width",strs[1] < minWidth ? minWidth - 10 : "auto");
|
||||
centerObj.height((strs[0] < minHeight ? minHeight : strs[0]) - headerObj.height() - footerObj.height() - (strs[1] < minWidth ? 42 : 28));
|
||||
|
||||
$("#openClose").height($("#openClose").height() - 5);
|
||||
|
||||
frameObj.height($("#right").height()-quickObj.height());
|
||||
|
||||
<c:if test="${tabmode eq '1'}">
|
||||
$(".jericho_tab iframe").height(0).height($("#right").height() - tabTitleHeight - quickObj.height());
|
||||
$('#jerichotab_contentholder').height(0).height($("#right").height() - tabTitleHeight - quickObj.height());
|
||||
</c:if>
|
||||
|
||||
wSizeWidth();
|
||||
|
||||
}
|
||||
|
||||
var wSizeWidth = function (){
|
||||
if (!$("#openClose").is(":hidden")){
|
||||
var leftWidth = ($("#left").width() < 0 ? 0 : $("#left").width());
|
||||
$("#right").width($("#content").width()- leftWidth - $("#openClose").width() -5);
|
||||
}else{
|
||||
$("#right").width("100%");
|
||||
}
|
||||
}
|
||||
|
||||
var sidebar_init = function() {
|
||||
menu_action_init();
|
||||
system_menu_default_page();
|
||||
}
|
||||
|
||||
//系统进入默认首页界面
|
||||
var system_menu_default_page = function() {
|
||||
var $topMenuFirst = $(".topnav li a:first").click();
|
||||
|
||||
var menuId = "#menu-" + $topMenuFirst.attr("id");
|
||||
|
||||
// 初始化点击第一个二级菜单
|
||||
if ($(menuId + " dd:first .menuson").is(":hidden")){
|
||||
$(menuId + " dd:first .title").click();
|
||||
}
|
||||
|
||||
// 初始化点击第一个三级菜单
|
||||
if (!$(menuId + " dd:first .menuson li:first").hasClass("active")){
|
||||
var liobject = $(menuId + " dd:first .menuson li:first a i");
|
||||
liobject.click();
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
//菜单选择触发事件
|
||||
var menu_action_init = function() {
|
||||
|
||||
|
||||
//顶部导航切换
|
||||
$(".topnav li a").click(function(){
|
||||
// 一级菜单焦点
|
||||
$(".topnav li a.selected").removeClass("selected")
|
||||
$(this).addClass("selected");
|
||||
|
||||
// 顶部为直接链接,左侧区域隐藏
|
||||
if ($(this).attr("target") == "mainFrame"){
|
||||
$("#left,#openClose").hide();
|
||||
wSizeWidth();
|
||||
<c:if test="${tabmode eq '1'}"> // 隐藏页签
|
||||
$(".jericho_tab").hide();
|
||||
$("#mainFrame").show();
|
||||
</c:if>
|
||||
return true;
|
||||
}
|
||||
|
||||
// 左侧区域显示
|
||||
$("#left,#openClose").show();
|
||||
if(!$("#openClose").hasClass("close")){
|
||||
$("#openClose").click();
|
||||
}
|
||||
|
||||
// 显示二级菜单
|
||||
var menuId = "#menu-" + $(this).attr("id");
|
||||
|
||||
//默认加载所有菜单
|
||||
if ($(menuId).length){
|
||||
$("#left>.accordion").addClass("hide");
|
||||
$(menuId).removeClass("hide");
|
||||
} else {
|
||||
|
||||
// 获取二级菜单数据
|
||||
$.get($(this).attr("data-href"), function(data){
|
||||
if (data.indexOf("id=\"loginForm\"") != -1){
|
||||
alert('未登录或登录超时。请重新登录,谢谢!');
|
||||
top.location = "${pageContext.request.contextPath}/";
|
||||
return false;
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
// 大小宽度调整
|
||||
wSizeWidth();
|
||||
return false;
|
||||
|
||||
})
|
||||
|
||||
|
||||
//快捷菜单显示隐藏动作
|
||||
$("#show-hide-option").click(function(event){
|
||||
|
||||
var disp = $("#quickMenu").css("display");
|
||||
if(!disp || disp == "block" ) {
|
||||
$("#quickMenu").slideUp(200,function(){
|
||||
$("#show-hide-option").removeClass().addClass("icon-eye-close");
|
||||
wSize();
|
||||
});
|
||||
|
||||
}else {
|
||||
$("#quickMenu").slideDown(200,function(){
|
||||
$("#show-hide-option").removeClass().addClass("icon-eye-open");
|
||||
wSize();
|
||||
});
|
||||
|
||||
}
|
||||
event.preventDefault();
|
||||
|
||||
});
|
||||
|
||||
|
||||
// 二级标题
|
||||
$('.leftmenu .title').click(function(){
|
||||
menu_header_active($(this));
|
||||
});
|
||||
|
||||
|
||||
|
||||
// 展现三级
|
||||
$(".menuson>li>a").click(function(){
|
||||
|
||||
$(".menuson li.active").removeClass("active");
|
||||
|
||||
$(this).parent().addClass("active");
|
||||
|
||||
|
||||
var href = $(this).attr("data-href");
|
||||
if($(href).length > 0){
|
||||
$(href).toggle().parent().toggle();
|
||||
return false;
|
||||
}
|
||||
|
||||
//breadcrumb($(this));
|
||||
<c:if test="${tabmode eq '1'}"> //打开显示页签
|
||||
return App.addTab($(this),true);
|
||||
</c:if>
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
// 鼠标移动到边界自动弹出左侧菜单
|
||||
$("#openClose").mouseover(function(){
|
||||
if($(this).hasClass("open")){
|
||||
$(this).click();
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
|
||||
//生成当前位置栏目
|
||||
var breadcrumb = function($this) {
|
||||
var names = $this.attr("data-name").split("-");
|
||||
var breadHtml = '<li><a href="${pageContext.request.contextPath}/" >首页</a></li>';
|
||||
|
||||
for (i=0; i<names.length; i++) {
|
||||
breadHtml += '<li><a href="javascript:void(0);" >'+names[i]+'</a></li>';
|
||||
}
|
||||
|
||||
$('.placeul').html(breadHtml);
|
||||
}
|
||||
|
||||
//左侧菜单标题点击时触发事件
|
||||
var menu_header_active = function($this){
|
||||
var $ul = $this.next('ul');
|
||||
$('dd').find('.menuson').slideUp();
|
||||
if($ul.is(':visible')){
|
||||
$this.next('.menuson').slideUp();
|
||||
}else{
|
||||
$this.next('.menuson').slideDown();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
return {
|
||||
init:function(){
|
||||
|
||||
handleResponsiveOnResize();
|
||||
|
||||
// 链接去掉虚框
|
||||
$("#left a").bind("focus",function() {
|
||||
if(this.blur) {this.blur()};
|
||||
});
|
||||
|
||||
|
||||
<c:if test="${tabmode eq '1'}"> //初始化页签
|
||||
$.fn.initJerichoTab({
|
||||
renderTo: '#right', uniqueId: 'jerichotab',
|
||||
contentCss: { 'height': $('#right').height() - quickObj.height() - tabTitleHeight },
|
||||
tabs: [], loadOnce: true, tabWidth: 110, titleHeight: tabTitleHeight, quickActionMenu: "#right .quick-actions_homepage"
|
||||
});
|
||||
</c:if>
|
||||
|
||||
sidebar_init();
|
||||
|
||||
|
||||
<c:if test="${tabmode eq '1'}"> //下拉菜单以选项卡方式打开
|
||||
$("#userInfo .dropdown-menu a").mouseup(function(){
|
||||
return App.addTab($(this), true);
|
||||
});
|
||||
</c:if>
|
||||
|
||||
|
||||
|
||||
},
|
||||
addTab:function($this,refresh) {
|
||||
$(".jericho_tab").show();
|
||||
$("#mainFrame").hide();
|
||||
$.fn.jerichoTab.addTab({
|
||||
tabFirer: $this,
|
||||
title: $this.text(),
|
||||
closeable: true,
|
||||
data: {
|
||||
dataType: 'iframe',
|
||||
dataLink: $this.attr('href')
|
||||
}
|
||||
}).loadData(refresh);
|
||||
return false;
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
}();
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
80
src/main/webapp/WEB-INF/views/cfg/ipBlockForm.jsp
Normal file
@@ -0,0 +1,80 @@
|
||||
<%@ page contentType="text/html;charset=UTF-8"%>
|
||||
<%@ include file="/WEB-INF/include/taglib.jsp"%>
|
||||
<html>
|
||||
<head>
|
||||
<title>来函信息</title>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="page-content">
|
||||
|
||||
<h3 class="page-title">
|
||||
Managed Datatables <small>managed datatable samples</small>
|
||||
</h3>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="portlet box blue">
|
||||
<div class="portlet-title">
|
||||
<div class="caption">
|
||||
<i class="fa fa-gift"></i>IP管控新增 </div>
|
||||
<div class="tools">
|
||||
<a href="javascript:;" class="collapse" data-original-title="" title=""> </a>
|
||||
<a href="#portlet-config" data-toggle="modal" class="config" data-original-title="" title=""> </a>
|
||||
<a href="javascript:;" class="reload" data-original-title="" title=""> </a>
|
||||
<a href="javascript:;" class="remove" data-original-title="" title=""> </a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="portlet-body form">
|
||||
<!-- BEGIN FORM-->
|
||||
<form action="#" class="form-horizontal">
|
||||
<div class="form-body">
|
||||
|
||||
<%@include file="/WEB-INF/include/form/ipInfo.jsp" %>
|
||||
|
||||
<!-- <div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-3">IP地址</label>
|
||||
<div class="col-md-8">
|
||||
<input class="form-control" type="text">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-group ">
|
||||
<label class="control-label col-md-3">配置名称</label>
|
||||
<div class="col-md-8">
|
||||
<input class="form-control" type="text">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
-->
|
||||
<%@include file="/WEB-INF/include/form/basicInfo.jsp" %>
|
||||
|
||||
|
||||
</div>
|
||||
<div class="form-actions">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="row">
|
||||
<div class="col-md-offset-3 col-md-8">
|
||||
<button type="submit" class="btn green">保存</button>
|
||||
<button type="button" class="btn default">Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6"> </div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<!-- END FORM-->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
165
src/main/webapp/WEB-INF/views/cfg/ipBlockList.jsp
Normal file
@@ -0,0 +1,165 @@
|
||||
<%@ page contentType="text/html;charset=UTF-8"%>
|
||||
<%@ include file="/WEB-INF/include/taglib.jsp"%>
|
||||
<html>
|
||||
<head>
|
||||
<title>来函信息</title>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="page-content">
|
||||
<div class="theme-panel hidden-xs hidden-sm">
|
||||
<button type="button" class="btn btn-default"> 刷新 </button>
|
||||
|
||||
<button type="button" class="btn btn-primary"
|
||||
onClick="javascript:window.location='${ctx}/cfg/ip/ipBlockForm'"> 新增 </button>
|
||||
</div>
|
||||
|
||||
<h3 class="page-title">
|
||||
IP管控详情
|
||||
</h3>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="portlet box blue">
|
||||
<div class="portlet-title">
|
||||
<div class="caption">
|
||||
<i class="fa fa-cogs"></i>IP管控详情
|
||||
</div>
|
||||
<div class="tools">
|
||||
<a href="javascript:;" class="collapse" data-original-title=""
|
||||
title=""> </a> <a href="#portlet-config" data-toggle="modal"
|
||||
class="config" data-original-title="" title=""> </a> <a
|
||||
href="javascript:;" class="reload" data-original-title=""
|
||||
title=""> </a> <a href="javascript:;" class="remove"
|
||||
data-original-title="" title=""> </a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="portlet-body">
|
||||
|
||||
|
||||
<div class="row" >
|
||||
|
||||
|
||||
<div class="col-md-12">
|
||||
|
||||
|
||||
<select>
|
||||
<option>标题</option>
|
||||
<option>来函函号</option>
|
||||
<option>任务</option>
|
||||
</select> <input> <select>
|
||||
<option>来函时间</option>
|
||||
<option>操作时间</option>
|
||||
</select> <input>
|
||||
|
||||
<button type="button" class="btn btn-default btn-sm">
|
||||
<i class="fa fa-edit"></i> 搜索
|
||||
</button>
|
||||
排序: <select>
|
||||
<option>默认排序</option>
|
||||
<option>按来函时间顺序</option>
|
||||
<option>按来函时间倒序</option>
|
||||
<option>按操作时间顺序</option>
|
||||
<option>按操作时间倒序</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div class="table-responsive">
|
||||
<table class="table table-bordered">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>序号</th>
|
||||
<th>来函函号</th>
|
||||
<th>来函单位</th>
|
||||
<th>来函时间</th>
|
||||
|
||||
|
||||
<th>任务</th>
|
||||
<th>操作员</th>
|
||||
<th>操作时间</th>
|
||||
<th>标题</th>
|
||||
<th>内容</th>
|
||||
<th>备注</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>20181720函号</td>
|
||||
<td>来函单位 </d>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
|
||||
<td>七五专项</td>
|
||||
<td>Admin</td>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
<td>标题</td>
|
||||
<td>test</td>
|
||||
<td>test</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td>20181720函号</td>
|
||||
<td>来函单位 </d>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
|
||||
<td>七五专项</td>
|
||||
<td>Admin</td>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
<td>标题</td>
|
||||
<td>test</td>
|
||||
<td>test</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>3</td>
|
||||
<td>20181720函号</td>
|
||||
<td>来函单位 </d>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
|
||||
<td>七五专项</td>
|
||||
<td>Admin</td>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
<td>标题</td>
|
||||
<td>test</td>
|
||||
<td>test</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>4</td>
|
||||
<td>20181720函号</td>
|
||||
<td>来函单位 </d>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
|
||||
<td>七五专项</td>
|
||||
<td>Admin</td>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
<td>标题</td>
|
||||
<td>test</td>
|
||||
<td>test</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>5</td>
|
||||
<td>20181720函号</td>
|
||||
<td>来函单位 </d>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
|
||||
<td>七五专项</td>
|
||||
<td>Admin</td>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
<td>标题</td>
|
||||
<td>test</td>
|
||||
<td>test</td>
|
||||
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
62
src/main/webapp/WEB-INF/views/cfg/ipWhiteForm.jsp
Normal file
@@ -0,0 +1,62 @@
|
||||
<%@ page contentType="text/html;charset=UTF-8"%>
|
||||
<%@ include file="/WEB-INF/include/taglib.jsp"%>
|
||||
<html>
|
||||
<head>
|
||||
<title>来函信息</title>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="page-content">
|
||||
|
||||
<h3 class="page-title">
|
||||
Managed Datatables <small>managed datatable samples</small>
|
||||
</h3>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="portlet box blue">
|
||||
<div class="portlet-title">
|
||||
<div class="caption">
|
||||
<i class="fa fa-gift"></i>IP管控白名单-新增 </div>
|
||||
<div class="tools">
|
||||
<a href="javascript:;" class="collapse" data-original-title="" title=""> </a>
|
||||
<a href="#portlet-config" data-toggle="modal" class="config" data-original-title="" title=""> </a>
|
||||
<a href="javascript:;" class="reload" data-original-title="" title=""> </a>
|
||||
<a href="javascript:;" class="remove" data-original-title="" title=""> </a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="portlet-body form">
|
||||
<!-- BEGIN FORM-->
|
||||
<form action="#" class="form-horizontal">
|
||||
<div class="form-body">
|
||||
|
||||
<%@include file="/WEB-INF/include/form/ip6T.jsp" %>
|
||||
|
||||
|
||||
<%@include file="/WEB-INF/include/form/basicInfo.jsp" %>
|
||||
|
||||
|
||||
</div>
|
||||
<div class="form-actions">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="row">
|
||||
<div class="col-md-offset-3 col-md-8">
|
||||
<button type="submit" class="btn green">保存</button>
|
||||
<button type="button" class="btn default">Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6"> </div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<!-- END FORM-->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
165
src/main/webapp/WEB-INF/views/cfg/ipWhiteList.jsp
Normal file
@@ -0,0 +1,165 @@
|
||||
<%@ page contentType="text/html;charset=UTF-8"%>
|
||||
<%@ include file="/WEB-INF/include/taglib.jsp"%>
|
||||
<html>
|
||||
<head>
|
||||
<title>来函信息</title>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="page-content">
|
||||
<div class="theme-panel hidden-xs hidden-sm">
|
||||
<button type="button" class="btn btn-default"> 刷新 </button>
|
||||
|
||||
<button type="button" class="btn btn-primary"
|
||||
onClick="javascript:window.location='${ctx}/cfg/ip/ipWhiteForm'"> 新增 </button>
|
||||
</div>
|
||||
|
||||
<h3 class="page-title">
|
||||
IP管控白名单详情
|
||||
</h3>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="portlet box blue">
|
||||
<div class="portlet-title">
|
||||
<div class="caption">
|
||||
<i class="fa fa-cogs"></i>IP管控白名单
|
||||
</div>
|
||||
<div class="tools">
|
||||
<a href="javascript:;" class="collapse" data-original-title=""
|
||||
title=""> </a> <a href="#portlet-config" data-toggle="modal"
|
||||
class="config" data-original-title="" title=""> </a> <a
|
||||
href="javascript:;" class="reload" data-original-title=""
|
||||
title=""> </a> <a href="javascript:;" class="remove"
|
||||
data-original-title="" title=""> </a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="portlet-body">
|
||||
|
||||
|
||||
<div class="row" >
|
||||
|
||||
|
||||
<div class="col-md-12">
|
||||
|
||||
|
||||
<select>
|
||||
<option>标题</option>
|
||||
<option>来函函号</option>
|
||||
<option>任务</option>
|
||||
</select> <input> <select>
|
||||
<option>来函时间</option>
|
||||
<option>操作时间</option>
|
||||
</select> <input>
|
||||
|
||||
<button type="button" class="btn btn-default btn-sm">
|
||||
<i class="fa fa-edit"></i> 搜索
|
||||
</button>
|
||||
排序: <select>
|
||||
<option>默认排序</option>
|
||||
<option>按来函时间顺序</option>
|
||||
<option>按来函时间倒序</option>
|
||||
<option>按操作时间顺序</option>
|
||||
<option>按操作时间倒序</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div class="table-responsive">
|
||||
<table class="table table-bordered">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>序号</th>
|
||||
<th>来函函号</th>
|
||||
<th>来函单位</th>
|
||||
<th>来函时间</th>
|
||||
|
||||
|
||||
<th>任务</th>
|
||||
<th>操作员</th>
|
||||
<th>操作时间</th>
|
||||
<th>标题</th>
|
||||
<th>内容</th>
|
||||
<th>备注</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>20181720函号</td>
|
||||
<td>来函单位 </d>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
|
||||
<td>七五专项</td>
|
||||
<td>Admin</td>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
<td>标题</td>
|
||||
<td>test</td>
|
||||
<td>test</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td>20181720函号</td>
|
||||
<td>来函单位 </d>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
|
||||
<td>七五专项</td>
|
||||
<td>Admin</td>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
<td>标题</td>
|
||||
<td>test</td>
|
||||
<td>test</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>3</td>
|
||||
<td>20181720函号</td>
|
||||
<td>来函单位 </d>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
|
||||
<td>七五专项</td>
|
||||
<td>Admin</td>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
<td>标题</td>
|
||||
<td>test</td>
|
||||
<td>test</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>4</td>
|
||||
<td>20181720函号</td>
|
||||
<td>来函单位 </d>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
|
||||
<td>七五专项</td>
|
||||
<td>Admin</td>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
<td>标题</td>
|
||||
<td>test</td>
|
||||
<td>test</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>5</td>
|
||||
<td>20181720函号</td>
|
||||
<td>来函单位 </d>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
|
||||
<td>七五专项</td>
|
||||
<td>Admin</td>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
<td>标题</td>
|
||||
<td>test</td>
|
||||
<td>test</td>
|
||||
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
96
src/main/webapp/WEB-INF/views/cfg/requestForm.jsp
Normal file
@@ -0,0 +1,96 @@
|
||||
<%@ page contentType="text/html;charset=UTF-8"%>
|
||||
<%@ include file="/WEB-INF/include/taglib.jsp"%>
|
||||
<html>
|
||||
<head>
|
||||
<title>来函信息</title>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="page-content">
|
||||
|
||||
<h3 class="page-title">
|
||||
Managed Datatables <small>managed datatable samples</small>
|
||||
</h3>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="portlet box blue">
|
||||
<div class="portlet-title">
|
||||
<div class="caption">
|
||||
<i class="fa fa-gift"></i>Form Actions On Bottom </div>
|
||||
<div class="tools">
|
||||
<a href="javascript:;" class="collapse"> </a>
|
||||
<a href="#portlet-config" data-toggle="modal" class="config"> </a>
|
||||
<a href="javascript:;" class="reload"> </a>
|
||||
<a href="javascript:;" class="remove"> </a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="portlet-body form">
|
||||
<!-- BEGIN FORM-->
|
||||
<form action="#" class="form-horizontal">
|
||||
<div class="form-body">
|
||||
<div class="form-group">
|
||||
<label class="col-md-3 control-label">函号:</label>
|
||||
<div class="col-md-4">
|
||||
<input type="text" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="col-md-3 control-label">来函单位:</label>
|
||||
<div class="col-md-4">
|
||||
<input type="text" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="col-md-3 control-label">来函时间:</label>
|
||||
<div class="col-md-4">
|
||||
<input type="text" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="col-md-3 control-label">标题:</label>
|
||||
<div class="col-md-4">
|
||||
<input type="text" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="col-md-3 control-label">专项:</label>
|
||||
<div class="col-md-4">
|
||||
<div class="input-icon right">
|
||||
<input type="text" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="col-md-3 control-label">描述:</label>
|
||||
<div class="col-md-4">
|
||||
<input type="text" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group last">
|
||||
<label class="col-md-3 control-label">内容:</label>
|
||||
<div class="col-md-4">
|
||||
<input type="text" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-actions">
|
||||
<div class="row">
|
||||
<div class="col-md-offset-3 col-md-9">
|
||||
<button type="submit" class="btn btn-circle green">提交</button>
|
||||
<button type="button" class="btn btn-circle grey-salsa btn-outline">Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<!-- END FORM-->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
167
src/main/webapp/WEB-INF/views/cfg/requestList.jsp
Normal file
@@ -0,0 +1,167 @@
|
||||
<%@ page contentType="text/html;charset=UTF-8"%>
|
||||
<%@ include file="/WEB-INF/include/taglib.jsp"%>
|
||||
<html>
|
||||
<head>
|
||||
<title>来函信息</title>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="page-content">
|
||||
<div class="theme-panel hidden-xs hidden-sm">
|
||||
<button type="button" class="btn btn-default"> 刷新 </button>
|
||||
|
||||
<button type="button" class="btn btn-primary"
|
||||
onClick="javascript:window.location='${ctx}/cfg/request/form'"> 新增来函 </button>
|
||||
</div>
|
||||
|
||||
<h3 class="page-title">
|
||||
Managed Datatables <small>managed datatable samples</small>
|
||||
</h3>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="portlet box blue">
|
||||
<div class="portlet-title">
|
||||
<div class="caption">
|
||||
<i class="fa fa-cogs"></i>来函函号
|
||||
</div>
|
||||
<div class="tools">
|
||||
<a href="javascript:;" class="collapse" data-original-title=""
|
||||
title=""> </a> <a href="#portlet-config" data-toggle="modal"
|
||||
class="config" data-original-title="" title=""> </a> <a
|
||||
href="javascript:;" class="reload" data-original-title=""
|
||||
title=""> </a> <a href="javascript:;" class="remove"
|
||||
data-original-title="" title=""> </a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="portlet-body">
|
||||
|
||||
|
||||
<div class="row" >
|
||||
|
||||
|
||||
<div class="col-md-12">
|
||||
|
||||
状态:<select class="select2">
|
||||
<option>未审核</option>
|
||||
<option>审核通过</option>
|
||||
</select>
|
||||
|
||||
<select>
|
||||
<option>标题</option>
|
||||
<option>来函函号</option>
|
||||
<option>任务</option>
|
||||
</select> <input> <select>
|
||||
<option>来函时间</option>
|
||||
<option>操作时间</option>
|
||||
</select> <input>
|
||||
|
||||
<button type="button" class="btn btn-default btn-sm">
|
||||
<i class="fa fa-edit"></i> 搜索
|
||||
</button>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div class="table-responsive">
|
||||
<table class="table table-bordered">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>序号</th>
|
||||
<th>来函函号</th>
|
||||
<th>来函单位</th>
|
||||
<th>来函时间</th>
|
||||
<th>状态</th>
|
||||
<th>任务</th>
|
||||
<th>操作员</th>
|
||||
<th>操作时间</th>
|
||||
<th>标题</th>
|
||||
<th>内容</th>
|
||||
<th>备注</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>20181720函号</td>
|
||||
<td>来函单位 </d>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
<td><span class="label label-sm label-success"> 通过
|
||||
</span></td>
|
||||
<td>七五专项</td>
|
||||
<td>Admin</td>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
<td>标题</td>
|
||||
<td>test</td>
|
||||
<td>test</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td>20181720函号</td>
|
||||
<td>来函单位 </d>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
<td><span class="label label-sm label-success"> 通过
|
||||
</span></td>
|
||||
<td>七五专项</td>
|
||||
<td>Admin</td>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
<td>标题</td>
|
||||
<td>test</td>
|
||||
<td>test</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>3</td>
|
||||
<td>20181720函号</td>
|
||||
<td>来函单位 </d>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
<td><span class="label label-sm label-success"> 通过
|
||||
</span></td>
|
||||
<td>七五专项</td>
|
||||
<td>Admin</td>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
<td>标题</td>
|
||||
<td>test</td>
|
||||
<td>test</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>4</td>
|
||||
<td>20181720函号</td>
|
||||
<td>来函单位 </d>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
<td><span class="label label-sm label-success"> 通过
|
||||
</span></td>
|
||||
<td>七五专项</td>
|
||||
<td>Admin</td>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
<td>标题</td>
|
||||
<td>test</td>
|
||||
<td>test</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>5</td>
|
||||
<td>20181720函号</td>
|
||||
<td>来函单位 </d>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
<td><span class="label label-sm label-success"> 通过
|
||||
</span></td>
|
||||
<td>七五专项</td>
|
||||
<td>Admin</td>
|
||||
<td>2018-01-06 21:57:03</td>
|
||||
<td>标题</td>
|
||||
<td>test</td>
|
||||
<td>test</td>
|
||||
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,633 +1,331 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@ include file="/WEB-INF/include/taglib.jsp"%>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<c:set var="tabmode" value="${empty cookie.tabmode.value ? '1' : cookie.tabmode.value}"/>
|
||||
<c:set var="workNotifyRemindInterval" value="${fns:getStringProperty('work.notify.remind.interval','')}"/>
|
||||
<c:if test="${tabmode eq '1'}">
|
||||
<link rel="Stylesheet" href="${pageContext.request.contextPath}/static/jerichotab/css/jquery.jerichotab.css" />
|
||||
<script type="text/javascript" src="${pageContext.request.contextPath}/static/jerichotab/js/jquery.jerichotab.js"></script>
|
||||
</c:if>
|
||||
<link rel="shortcut icon" href="${pageContext.request.contextPath}/static/images/mvc_frame.ico"/>
|
||||
|
||||
<link rel="shortcut icon" href="${pageContext.request.contextPath}/static/pages/img/logo.ico" />
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<title>${fns:getStringProperty('productName','NIS')}</title>
|
||||
|
||||
<style type="text/css">
|
||||
h3{color:#ffffff;margin:30px 0px 0px 10px;}
|
||||
</style>
|
||||
<script src="${pageContext.request.contextPath}/static/pages/scripts/home.js" type="text/javascript"></script>
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<div id="main">
|
||||
<!-- header -->
|
||||
<div id="header" class="navbar navbar-fixed-top">
|
||||
<div class="navbar-inner">
|
||||
<div class="topleft">
|
||||
<a href="${pageContext.request.contextPath}/" target="_parent">
|
||||
<h3>National Firewall System</h3></a>
|
||||
</div>
|
||||
<ul class="topnav">
|
||||
<c:forEach items="${fns:getMenuTreeList()}" var="menu" varStatus="idxStatus">
|
||||
|
||||
<c:if test="${menu.parent.id eq 1 && menu.isShow eq 1}">
|
||||
|
||||
|
||||
<c:if test="${menu.href != null && menu.href != ''}" var="leafNodeFlag">
|
||||
|
||||
<body class="page-header-fixed page-sidebar-closed-hide-logo page-content-white">
|
||||
<!-- BEGIN HEADER -->
|
||||
<div class="page-header navbar navbar-fixed-top">
|
||||
|
||||
<!-- BEGIN HEADER INNER -->
|
||||
<div class="page-header-inner ">
|
||||
|
||||
<!-- BEGIN LOGO -->
|
||||
<div class="page-logo">
|
||||
<a href="index.html"> <img
|
||||
src="${pageContext.request.contextPath}/static/layouts/layout/img/logo.png"
|
||||
alt="logo" class="logo-default" />
|
||||
</a>
|
||||
</div>
|
||||
<!-- END LOGO -->
|
||||
|
||||
|
||||
<!-- BEGIN MEGA MENU -->
|
||||
<div class="hor-menu hidden-sm hidden-xs">
|
||||
|
||||
<ul class="nav navbar-nav mega-menu">
|
||||
|
||||
|
||||
<c:forEach items="${fns:getMenuTreeList()}" var="menu" varStatus="idxStatus">
|
||||
|
||||
<c:if test="${menu.isTop eq 1 && menu.isShow eq 1}">
|
||||
|
||||
<li>
|
||||
<a href="${ctx}${menu.href}" id="${menu.id}" target="mainFrame" class="${idxStatus.index eq 0 ? 'selected' : ''}">
|
||||
<img src="${ctxStatic}/images/${menu.icon}.png" title="<spring:message code="${menu.code}"></spring:message>" />
|
||||
<h2><%-- ${menu.name } --%><spring:message code="${menu.code}"></spring:message></h2>
|
||||
</a>
|
||||
<c:choose>
|
||||
<c:when test="${not empty menu.children and menu.children[0].isTop eq 1 }">
|
||||
|
||||
<a href="javascript:;" id="${menu.id}" data-hover="megamenu-dropdown" data-close-others="true">
|
||||
${menu.name }<%-- <spring:message code="${menu.code}"></spring:message> --%>
|
||||
<i class="fa fa-angle-down"></i>
|
||||
</a>
|
||||
|
||||
<ul class="dropdown-menu pull-left">
|
||||
<c:forEach items="${menu.children}" var="secondMenu" varStatus="secondStatus">
|
||||
<c:if test="${secondMenu.isTop eq 1 && secondMenu.isShow eq 1}">
|
||||
<c:if test="${secondStatus.index==2}">
|
||||
<li class="divider"></li>
|
||||
</c:if>
|
||||
<li>
|
||||
<a href="javascript:;" id="${secondMenu.id}">
|
||||
<i class="fa ${secondMenu.icon }"></i> ${secondMenu.name }<%-- <spring:message code="${secondMenu.code}"></spring:message> --%>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
</c:if>
|
||||
|
||||
</c:forEach>
|
||||
|
||||
</ul>
|
||||
</c:when>
|
||||
|
||||
<c:otherwise>
|
||||
<a href="javascript:;" id="${menu.id}">
|
||||
${menu.name }<%-- <spring:message code="${menu.code}"></spring:message> --%>
|
||||
</a>
|
||||
</c:otherwise>
|
||||
</c:choose>
|
||||
|
||||
</li>
|
||||
</c:if>
|
||||
|
||||
<c:if test="${!leafNodeFlag }">
|
||||
<li>
|
||||
<a href="javascript:void(0);" id="${menu.id}" class="${idxStatus.index eq 0 ? 'selected' : ''}">
|
||||
<img src="${ctxStatic}/images/${menu.icon}.png" title="<spring:message code="${menu.code}"></spring:message>" />
|
||||
<h2><%-- ${menu.name} --%>
|
||||
<spring:message code="${menu.code}"></spring:message>
|
||||
</h2>
|
||||
</a>
|
||||
</li>
|
||||
</c:if>
|
||||
|
||||
|
||||
|
||||
</c:if>
|
||||
|
||||
|
||||
</c:forEach>
|
||||
</ul>
|
||||
|
||||
<div class="topright">
|
||||
<ul>
|
||||
<li><a href="${pageContext.request.contextPath}/" title="访问网站主页"><i class="icon-home"></i><spring:message code="home"></spring:message></a></li>
|
||||
<li><a href="#"><i class="icon-question-sign"></i> <spring:message code="help"></spring:message></a></li>
|
||||
<li><a href="${pageContext.request.contextPath }/logout" title="退出登录"><i class="icon-signout"></i> <spring:message code="exit"></spring:message></a></li>
|
||||
</ul>
|
||||
|
||||
<div class="user">
|
||||
|
||||
<ul class="nav pull-right">
|
||||
<li id="userInfo" class="dropdown">
|
||||
<a class="dropdown-toggle" data-toggle="dropdown" href="#" title="个人信息"><i class="icon-user"></i> <spring:message code="hi"></spring:message>,${fns:getUser().name} <span id="notifyNum" class="label label-info hide"></span><b class="caret"></b></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="${ctx}/sys/user/info" target="mainFrame"><i class="icon-user"></i> <spring:message code="userInfo"></spring:message></a></li>
|
||||
<li><a href="${ctx}/sys/user/modifyPwd" target="mainFrame"><i class="icon-lock"></i> <spring:message code="updatePwd"></spring:message></a></li>
|
||||
<li><a href="${ctx}oa/oaNotify/self" target="mainFrame"><i class="icon-bell"></i> <spring:message code="notify"></spring:message> <span id="notifyNum2" class="label label-info hide"></span></a></li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<li id="themeSwitch" class="dropdown">
|
||||
<a class="dropdown-toggle" data-toggle="dropdown" href="#" title="主题切换"><i class="icon-th-large"></i> <b class="caret"></b></a>
|
||||
<ul class="dropdown-menu">
|
||||
<c:forEach items="${fns:getDictList('SYS_THEME')}" var="dict">
|
||||
<li <c:if test="${cookie.theme.value eq dict.itemCode}">class='active'</c:if>>
|
||||
<a href="#" onclick="location='${pageContext.request.contextPath}/theme/${dict.itemCode}?url='+location.href">${dict.itemValue}</a>
|
||||
</li>
|
||||
</c:forEach>
|
||||
|
||||
<li><a href="javascript:cookie('tabmode','${tabmode eq '1' ? '0' : '1'}');location=location.href">${tabmode eq '1' ? '关闭' : '开启'}页签模式</a></li>
|
||||
<li><a href="${pageContext.request.contextPath}/language?language=en">英语</a></li>
|
||||
<li><a href="${pageContext.request.contextPath}/language?language=zh_CN">中文</a></li>
|
||||
<li><a href="${pageContext.request.contextPath}/language?language=ru">俄文</a></li>
|
||||
</ul>
|
||||
<!--[if lte IE 6]><script type="text/javascript">$('#themeSwitch').hide();</script><![endif]-->
|
||||
</li>
|
||||
|
||||
<li><a href="javascript:void(0);" class="tip-bottom" title="显示/隐藏快捷菜单"><i id="show-hide-option" class="icon-eye-open"></i></a></li>
|
||||
|
||||
</ul>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- main content -->
|
||||
<div class="container-fluid">
|
||||
<div id="content" class="row-fluid">
|
||||
<div id="left">
|
||||
<!-- sidebar -->
|
||||
<c:forEach items="${fns:getMenuTreeList()}" var="menu" varStatus="idxStatus">
|
||||
<c:if test="${not empty menu.children }">
|
||||
|
||||
<div id="menu-${menu.id }" class="accordion ${idxStatus.index eq 0 ? '' : 'hide'}">
|
||||
<div class="lefttop"><span></span><%-- ${menu.name } --%>
|
||||
<spring:message code="${menu.code}"></spring:message></div>
|
||||
<dl class="leftmenu">
|
||||
<%-- <dd><div id="menu-0-0" class="title"><i class="icon-check" ></i>
|
||||
<a id="menu-81-70" data-id="70" data-name="国际化" href="${pageContext.request.contextPath}/something" target="mainFrame" jerichotabindex="0">示例</a>
|
||||
</div>
|
||||
</dd> --%>
|
||||
<c:forEach items="${menu.children}" var="secondMenu">
|
||||
<dd>
|
||||
<div id="menu-${menu.id }-${secondMenu.id}" class="title">
|
||||
<img src="${ctxStatic}/images/${secondMenu.icon}.png" title="${secondMenu.name }"/>
|
||||
<%-- <span class="${secondMenu.icon } icon-white"></span> --%>
|
||||
<%-- ${secondMenu.name} --%>
|
||||
<spring:message code="${secondMenu.code}"></spring:message>
|
||||
</div>
|
||||
<ul class="menuson">
|
||||
|
||||
|
||||
<c:forEach items="${secondMenu.children}" var="thirdMenu" varStatus="thirdIdxStatus">
|
||||
<c:if test="${thirdMenu.href != null && thirdMenu.href != '' }">
|
||||
|
||||
<li>
|
||||
<span class="${not empty thirdMenu.icon?thirdMenu.icon:'icon-hide'} icon-white"></span>
|
||||
<a id="menu-${menu.id }-${secondMenu.id}-${thirdMenu.id}" data-id="${thirdMenu.id}" data-name="${menu.name }-${secondMenu.name}-${thirdMenu.name}"
|
||||
href="${ctx}${thirdMenu.href}" target="mainFrame">
|
||||
<%-- ${thirdMenu.name } --%>
|
||||
<spring:message code="${thirdMenu.code}"></spring:message>
|
||||
<i></i></a>
|
||||
</li>
|
||||
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</ul>
|
||||
|
||||
|
||||
</dd>
|
||||
|
||||
|
||||
|
||||
</c:forEach>
|
||||
|
||||
</dl>
|
||||
|
||||
</div>
|
||||
</c:if>
|
||||
</c:if>
|
||||
|
||||
</c:forEach>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div id="openClose" class="close"> </div>
|
||||
|
||||
<div id="right">
|
||||
<div class="quick-actions_homepage">
|
||||
<div id="quickMenu">
|
||||
<ul class="quick-actions">
|
||||
|
||||
<!-- <li class="bg_lb"> <a href="javascript:void(0);" onclick="go_home()"> <i class="icon-check"></i> 待办事项</a> </li> -->
|
||||
|
||||
<c:forEach items="${fns:getMenuTreeList()}" var="menu" varStatus="idxStatus">
|
||||
<c:if test="${not empty menu.children }">
|
||||
<c:forEach items="${menu.children}" var="secondMenu">
|
||||
|
||||
<c:if test="${not empty secondMenu.href and secondMenu.quickAction ne 0}">
|
||||
<c:if test="${secondMenu.quickAction==1}">
|
||||
<li class="${secondMenu.menuBg }">
|
||||
<a href="javascript:void(0);" onclick="page_turn('${menu.id}'+'_'+'${secondMenu.id}')"> <i class="${secondMenu.icon }"></i>
|
||||
<%-- ${secondMenu.name } --%>
|
||||
<spring:message code="${secondMenu.code}"></spring:message>
|
||||
<c:if test="${secondMenu.name eq '待办事项'}"><span id="notifyWorkedOption" class="label label-important hide"></span></c:if>
|
||||
</a>
|
||||
</li>
|
||||
</c:if>
|
||||
|
||||
<c:if test="${secondMenu.quickAction==2}">
|
||||
<li class="${secondMenu.menuBg } span3"> <a href="javascript:void(0);" onclick="page_turn('${menu.id}'+'_'+'${secondMenu.id}')">
|
||||
<i class="${secondMenu.icon }"></i>
|
||||
<%-- ${secondMenu.name } --%>
|
||||
<spring:message code="${secondMenu.code}"></spring:message>
|
||||
<c:if test="${secondMenu.name eq '待办事项'}"><span id="notifyWorkedOption" class="label label-important hide"></span></c:if></a> </li>
|
||||
</c:if>
|
||||
</c:if>
|
||||
|
||||
<c:forEach items="${secondMenu.children}" var="thirdMenu">
|
||||
<c:if test="${not empty thirdMenu.href and thirdMenu.quickAction ne 0}">
|
||||
<c:if test="${thirdMenu.quickAction==1}">
|
||||
<li class="${thirdMenu.menuBg }">
|
||||
<a href="javascript:void(0);" onclick="page_turn('${menu.id}'+'_'+'${secondMenu.id}'+'_'+'${thirdMenu.id}')">
|
||||
<i class="${thirdMenu.icon }"></i><%-- ${thirdMenu.name } --%>
|
||||
<spring:message code="${thirdMenu.code}"></spring:message>
|
||||
<c:if test="${thirdMenu.name eq '待办事项'}"><span id="notifyWorkedOption" class="label label-important hide"></span></c:if>
|
||||
</a>
|
||||
</li>
|
||||
</c:if>
|
||||
|
||||
<c:if test="${thirdMenu.quickAction==2}">
|
||||
<li class="${thirdMenu.menuBg } span3">
|
||||
<a href="javascript:void(0);" onclick="page_turn('${menu.id}'+'_'+'${secondMenu.id}'+'_'+'${thirdMenu.id}')"> <i class="${thirdMenu.icon }"></i>
|
||||
<%-- ${thirdMenu.name } --%>
|
||||
<spring:message code="${thirdMenu.code}"></spring:message>
|
||||
<c:if test="${thirdMenu.name eq '待办事项'}"><span id="notifyWorkedOption" class="label label-important hide"></span></c:if>
|
||||
</a>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:if>
|
||||
|
||||
</c:forEach>
|
||||
|
||||
|
||||
|
||||
</c:forEach>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<%-- <div class="place">
|
||||
<span><i class="icon-home"></i> </span>
|
||||
<ul class="placeul">
|
||||
<li><a href="${pageContext.request.contextPath}/" >首页</a></li>
|
||||
<li><a href="javascript:void(0);" >首页</a></li>
|
||||
</ul>
|
||||
</div> --%>
|
||||
<iframe id="mainFrame" name="mainFrame" src="" style="overflow:visible;" scrolling="yes" frameborder="no" width="100%">
|
||||
浏览器不支持嵌入式框架或配置为不显示嵌入式框架。
|
||||
</iframe>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div id="footer" class="row-fluid">
|
||||
Copyright © 2015-${fns:getStringProperty('copyrightYear','2015')} ${fns:getStringProperty('productName','NIS')} - Powered By <a href="${pageContext.request.contextPath }" target="_blank">NIS</a> ${fns:getStringProperty('version','1.0')}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</ul>
|
||||
|
||||
|
||||
<!-- <ul class="nav navbar-nav mega-menu">
|
||||
<li><a
|
||||
href="javascript:;" id="1"> 来函登记</a></li>
|
||||
|
||||
<script type="text/javascript">
|
||||
|
||||
$(document).ready(function(){
|
||||
App.init();
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
function page_turn(ids) {
|
||||
var ids = ids.split("_");
|
||||
$("#"+ids[0]).click();
|
||||
|
||||
|
||||
|
||||
var $secondMenu = $("#menu-"+ids[0]+"-"+ids[1]).siblings(".menuson");
|
||||
|
||||
if ($secondMenu.is(':hidden')){
|
||||
$("#menu-"+ids[0]+"-"+ids[1]).click();
|
||||
}
|
||||
|
||||
var $thirdMenu = $("#menu-"+ids[0]+"-"+ids[1]+"-"+ids[2]);
|
||||
|
||||
if (!$thirdMenu.parent().hasClass("active")) {
|
||||
$thirdMenu.children("i").click();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
var App = function() {
|
||||
|
||||
var leftWidth = 190; // 左侧窗口大小
|
||||
var tabTitleHeight = 33; // 页签的高度
|
||||
var htmlObj = $("html"), mainObj = $("#main");
|
||||
var headerObj = $("#header"), footerObj = $("#footer");
|
||||
var centerObj = $("#left, #openClose, #right");
|
||||
var frameObj = $("#right iframe");
|
||||
var quickObj = $("#right .quick-actions_homepage");
|
||||
|
||||
var handleResponsiveOnResize = function(){
|
||||
|
||||
$("#left").width(leftWidth);
|
||||
|
||||
$("#openClose").click(function(){
|
||||
if($(this).hasClass("close")){
|
||||
|
||||
$(this).removeClass("close").addClass("open");
|
||||
|
||||
$("#left").animate({width:0,opacity:"hide"});
|
||||
|
||||
$("#right").animate({width:$("#content").width()-$("#openClose").width()-5},function(){
|
||||
if(typeof openCloseClickCallBack=="function"){
|
||||
openCloseClickCallBack(true);
|
||||
}
|
||||
wSize();
|
||||
}
|
||||
)
|
||||
} else {
|
||||
$(this).removeClass("open").addClass("close");
|
||||
|
||||
$("#left").animate({width:leftWidth,opacity:"show"});
|
||||
|
||||
$("#right").animate({width:$("#content").width()-$("#openClose").width()-leftWidth-9},function(){
|
||||
if(typeof openCloseClickCallBack=="function"){
|
||||
openCloseClickCallBack(true);
|
||||
}
|
||||
wSize();
|
||||
}
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
if(!Array.prototype.map){
|
||||
Array.prototype.map=function(e,d){
|
||||
var a=[],b=0;
|
||||
for(var c=0,f=this.length;c<f;c++){
|
||||
if(c in this){
|
||||
a[b++]=e.call(d,this[c],c,this)
|
||||
}
|
||||
}
|
||||
return a;
|
||||
}
|
||||
}
|
||||
|
||||
$(window).resize(function(){wSize()});
|
||||
|
||||
wSize();
|
||||
}
|
||||
|
||||
|
||||
<c:if test="${tabmode eq '1'}">
|
||||
var openCloseClickCallBack = function(b){
|
||||
$.fn.jerichoTab.resize();
|
||||
}
|
||||
</c:if>
|
||||
|
||||
|
||||
var getWindowSize = function(){
|
||||
return["Height","Width"].map(function(a){
|
||||
return window["inner"+a]||document.compatMode==="CSS1Compat"&&document.documentElement["client"+a]||document.body["client"+a]});
|
||||
}
|
||||
|
||||
//主界面自适应大小
|
||||
var wSize = function(){
|
||||
var minHeight = 500, minWidth = 980;
|
||||
var strs = getWindowSize().toString().split(",");
|
||||
|
||||
htmlObj.css({"overflow-x":strs[1] < minWidth ? "auto" : "hidden", "overflow-y":strs[0] < minHeight ? "auto" : "hidden"});
|
||||
mainObj.css("width",strs[1] < minWidth ? minWidth - 10 : "auto");
|
||||
centerObj.height((strs[0] < minHeight ? minHeight : strs[0]) - headerObj.height() - footerObj.height() - (strs[1] < minWidth ? 42 : 28));
|
||||
|
||||
$("#openClose").height($("#openClose").height() - 5);
|
||||
|
||||
frameObj.height($("#right").height()-quickObj.height());
|
||||
|
||||
<c:if test="${tabmode eq '1'}">
|
||||
$(".jericho_tab iframe").height(0).height($("#right").height() - tabTitleHeight - quickObj.height());
|
||||
$('#jerichotab_contentholder').height(0).height($("#right").height() - tabTitleHeight - quickObj.height());
|
||||
</c:if>
|
||||
|
||||
wSizeWidth();
|
||||
|
||||
}
|
||||
|
||||
var wSizeWidth = function (){
|
||||
if (!$("#openClose").is(":hidden")){
|
||||
var leftWidth = ($("#left").width() < 0 ? 0 : $("#left").width());
|
||||
$("#right").width($("#content").width()- leftWidth - $("#openClose").width() -5);
|
||||
}else{
|
||||
$("#right").width("100%");
|
||||
}
|
||||
}
|
||||
|
||||
var sidebar_init = function() {
|
||||
menu_action_init();
|
||||
system_menu_default_page();
|
||||
}
|
||||
|
||||
//系统进入默认首页界面
|
||||
var system_menu_default_page = function() {
|
||||
var $topMenuFirst = $(".topnav li a:first").click();
|
||||
|
||||
var menuId = "#menu-" + $topMenuFirst.attr("id");
|
||||
|
||||
// 初始化点击第一个二级菜单
|
||||
if ($(menuId + " dd:first .menuson").is(":hidden")){
|
||||
$(menuId + " dd:first .title").click();
|
||||
}
|
||||
|
||||
// 初始化点击第一个三级菜单
|
||||
if (!$(menuId + " dd:first .menuson li:first").hasClass("active")){
|
||||
var liobject = $(menuId + " dd:first .menuson li:first a i");
|
||||
liobject.click();
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
//菜单选择触发事件
|
||||
var menu_action_init = function() {
|
||||
|
||||
|
||||
//顶部导航切换
|
||||
$(".topnav li a").click(function(){
|
||||
// 一级菜单焦点
|
||||
$(".topnav li a.selected").removeClass("selected")
|
||||
$(this).addClass("selected");
|
||||
|
||||
// 顶部为直接链接,左侧区域隐藏
|
||||
if ($(this).attr("target") == "mainFrame"){
|
||||
$("#left,#openClose").hide();
|
||||
wSizeWidth();
|
||||
<c:if test="${tabmode eq '1'}"> // 隐藏页签
|
||||
$(".jericho_tab").hide();
|
||||
$("#mainFrame").show();
|
||||
</c:if>
|
||||
return true;
|
||||
}
|
||||
|
||||
// 左侧区域显示
|
||||
$("#left,#openClose").show();
|
||||
if(!$("#openClose").hasClass("close")){
|
||||
$("#openClose").click();
|
||||
}
|
||||
|
||||
// 显示二级菜单
|
||||
var menuId = "#menu-" + $(this).attr("id");
|
||||
|
||||
//默认加载所有菜单
|
||||
if ($(menuId).length){
|
||||
$("#left>.accordion").addClass("hide");
|
||||
$(menuId).removeClass("hide");
|
||||
} else {
|
||||
|
||||
// 获取二级菜单数据
|
||||
$.get($(this).attr("data-href"), function(data){
|
||||
if (data.indexOf("id=\"loginForm\"") != -1){
|
||||
alert('未登录或登录超时。请重新登录,谢谢!');
|
||||
top.location = "${pageContext.request.contextPath}/";
|
||||
return false;
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
// 大小宽度调整
|
||||
wSizeWidth();
|
||||
return false;
|
||||
|
||||
})
|
||||
|
||||
|
||||
//快捷菜单显示隐藏动作
|
||||
$("#show-hide-option").click(function(event){
|
||||
|
||||
var disp = $("#quickMenu").css("display");
|
||||
if(!disp || disp == "block" ) {
|
||||
$("#quickMenu").slideUp(200,function(){
|
||||
$("#show-hide-option").removeClass().addClass("icon-eye-close");
|
||||
wSize();
|
||||
});
|
||||
|
||||
}else {
|
||||
$("#quickMenu").slideDown(200,function(){
|
||||
$("#show-hide-option").removeClass().addClass("icon-eye-open");
|
||||
wSize();
|
||||
});
|
||||
|
||||
}
|
||||
event.preventDefault();
|
||||
|
||||
});
|
||||
|
||||
|
||||
// 二级标题
|
||||
$('.leftmenu .title').click(function(){
|
||||
menu_header_active($(this));
|
||||
});
|
||||
|
||||
|
||||
|
||||
// 展现三级
|
||||
$(".menuson>li>a").click(function(){
|
||||
|
||||
$(".menuson li.active").removeClass("active");
|
||||
|
||||
$(this).parent().addClass("active");
|
||||
|
||||
|
||||
var href = $(this).attr("data-href");
|
||||
if($(href).length > 0){
|
||||
$(href).toggle().parent().toggle();
|
||||
return false;
|
||||
}
|
||||
|
||||
//breadcrumb($(this));
|
||||
<c:if test="${tabmode eq '1'}"> //打开显示页签
|
||||
return App.addTab($(this),true);
|
||||
</c:if>
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
// 鼠标移动到边界自动弹出左侧菜单
|
||||
$("#openClose").mouseover(function(){
|
||||
if($(this).hasClass("open")){
|
||||
$(this).click();
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
|
||||
//生成当前位置栏目
|
||||
var breadcrumb = function($this) {
|
||||
var names = $this.attr("data-name").split("-");
|
||||
var breadHtml = '<li><a href="${pageContext.request.contextPath}/" >首页</a></li>';
|
||||
|
||||
for (i=0; i<names.length; i++) {
|
||||
breadHtml += '<li><a href="javascript:void(0);" >'+names[i]+'</a></li>';
|
||||
}
|
||||
|
||||
$('.placeul').html(breadHtml);
|
||||
}
|
||||
|
||||
//左侧菜单标题点击时触发事件
|
||||
var menu_header_active = function($this){
|
||||
var $ul = $this.next('ul');
|
||||
$('dd').find('.menuson').slideUp();
|
||||
if($ul.is(':visible')){
|
||||
$this.next('.menuson').slideUp();
|
||||
}else{
|
||||
$this.next('.menuson').slideDown();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
return {
|
||||
init:function(){
|
||||
|
||||
handleResponsiveOnResize();
|
||||
|
||||
// 链接去掉虚框
|
||||
$("#left a").bind("focus",function() {
|
||||
if(this.blur) {this.blur()};
|
||||
});
|
||||
|
||||
|
||||
<c:if test="${tabmode eq '1'}"> //初始化页签
|
||||
$.fn.initJerichoTab({
|
||||
renderTo: '#right', uniqueId: 'jerichotab',
|
||||
contentCss: { 'height': $('#right').height() - quickObj.height() - tabTitleHeight },
|
||||
tabs: [], loadOnce: true, tabWidth: 110, titleHeight: tabTitleHeight, quickActionMenu: "#right .quick-actions_homepage"
|
||||
});
|
||||
</c:if>
|
||||
|
||||
sidebar_init();
|
||||
|
||||
|
||||
<c:if test="${tabmode eq '1'}"> //下拉菜单以选项卡方式打开
|
||||
$("#userInfo .dropdown-menu a").mouseup(function(){
|
||||
return App.addTab($(this), true);
|
||||
});
|
||||
</c:if>
|
||||
|
||||
<li><a href="javascript:;"
|
||||
data-hover="megamenu-dropdown" data-close-others="true"> 配置管理
|
||||
<i class="fa fa-angle-down"></i>
|
||||
</a>
|
||||
<ul class="dropdown-menu pull-left">
|
||||
<li><a href="javascript:;" id="2"> <i class="fa fa-bookmark-o"></i>
|
||||
文本常规管控
|
||||
</a></li>
|
||||
<li><a href="javascript:;" id="4">
|
||||
<i class="fa fa-puzzle-piece"></i> 文本常规监测
|
||||
</a></li>
|
||||
<li class="divider"></li>
|
||||
<li><a href="javascript:;" id="3">
|
||||
<i class="fa fa-user"></i> 文本增强管控
|
||||
</a></li>
|
||||
<li><a href="javascript:;" id="5">
|
||||
<i class="fa fa-gift"></i> 文本增强监测
|
||||
</a></li>
|
||||
|
||||
</ul></li>
|
||||
|
||||
|
||||
<li><a href="javascript:;"
|
||||
data-hover="megamenu-dropdown" data-close-others="true"> 审核管理
|
||||
<i class="fa fa-angle-down"></i>
|
||||
</a>
|
||||
<ul class="dropdown-menu pull-left">
|
||||
<li><a href="javascript:;" id="2"> <i class="fa fa-bookmark-o"></i>
|
||||
文本常规管控
|
||||
</a></li>
|
||||
<li><a href="javascript:;" id="4">
|
||||
<i class="fa fa-puzzle-piece"></i> 文本常规监测
|
||||
</a></li>
|
||||
<li class="divider"></li>
|
||||
<li><a href="javascript:;" id="3">
|
||||
<i class="fa fa-user"></i> 文本增强管控
|
||||
</a></li>
|
||||
<li><a href="javascript:;" id="5">
|
||||
<i class="fa fa-gift"></i> 文本增强监测
|
||||
</a></li>
|
||||
|
||||
</ul></li>
|
||||
|
||||
<li><a href="javascript:;"
|
||||
data-hover="megamenu-dropdown" data-close-others="true"> 审计管理
|
||||
<i class="fa fa-angle-down"></i>
|
||||
</a>
|
||||
<ul class="dropdown-menu pull-left">
|
||||
<li><a href="javascript:;" id="2"> <i class="fa fa-bookmark-o"></i>
|
||||
文本常规管控
|
||||
</a></li>
|
||||
<li><a href="javascript:;" id="4">
|
||||
<i class="fa fa-puzzle-piece"></i> 文本常规监测
|
||||
</a></li>
|
||||
<li class="divider"></li>
|
||||
<li><a href="javascript:;" id="3">
|
||||
<i class="fa fa-user"></i> 文本增强管控
|
||||
</a></li>
|
||||
<li><a href="javascript:;" id="5">
|
||||
<i class="fa fa-gift"></i> 文本增强监测
|
||||
</a></li>
|
||||
|
||||
</ul></li>
|
||||
|
||||
<li><a href="javascript:;"
|
||||
data-hover="megamenu-dropdown" data-close-others="true"> 日志检索
|
||||
<i class="fa fa-angle-down"></i>
|
||||
</a>
|
||||
<ul class="dropdown-menu pull-left">
|
||||
<li><a href="javascript:;" id="2"> <i class="fa fa-bookmark-o"></i>
|
||||
文本常规管控
|
||||
</a></li>
|
||||
<li><a href="javascript:;" id="4">
|
||||
<i class="fa fa-puzzle-piece"></i> 文本常规监测
|
||||
</a></li>
|
||||
<li class="divider"></li>
|
||||
<li><a href="javascript:;" id="3">
|
||||
<i class="fa fa-user"></i> 文本增强管控
|
||||
</a></li>
|
||||
<li><a href="javascript:;" id="5">
|
||||
<i class="fa fa-gift"></i> 文本增强监测
|
||||
</a></li>
|
||||
|
||||
</ul></li>
|
||||
|
||||
|
||||
<li><a href="javascript:;" id="6"> 基本配置</a></li>
|
||||
|
||||
<li><a href="javascript:;" id="7"> 系统配置</a></li>
|
||||
|
||||
</ul>
|
||||
-->
|
||||
|
||||
|
||||
</div>
|
||||
<!-- END MEGA MENU -->
|
||||
|
||||
|
||||
<!-- BEGIN TOP NAVIGATION MENU -->
|
||||
<div class="top-menu">
|
||||
<ul class="nav navbar-nav pull-right">
|
||||
|
||||
<li class="dropdown dropdown-user" id="language">
|
||||
<a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown" data-hover="dropdown" >
|
||||
<i class="fa fa-language"></i><span class="username username-hide-on-mobile"> 简体中文 </span>
|
||||
</a>
|
||||
|
||||
<ul class="dropdown-menu">
|
||||
<li class="hide"><a href="${pageContext.request.contextPath}/language?language=zh_CN"> 简体中文 </a></li>
|
||||
<li><a href="${pageContext.request.contextPath}/language?language=en"> English </a></li>
|
||||
<li><a href="${pageContext.request.contextPath}/language?language=ru"> русский язык </a></li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<!-- BEGIN USER LOGIN DROPDOWN -->
|
||||
<li class="dropdown dropdown-user"><a href="javascript:;"
|
||||
class="dropdown-toggle" data-toggle="dropdown"
|
||||
data-hover="dropdown" data-close-others="true"> <img alt=""
|
||||
class="img-circle"
|
||||
src="${pageContext.request.contextPath}/static/pages/img/avatar.png" />
|
||||
<span class="username username-hide-on-mobile">
|
||||
${fns:getUser().name}</span> <i class="fa fa-angle-down"></i>
|
||||
</a>
|
||||
<ul class="dropdown-menu dropdown-menu-default">
|
||||
|
||||
<li><a href="${ctx}/sys/user/info" target="mainFrame"><i class="icon-user"></i> <spring:message code="userInfo"></spring:message></a></li>
|
||||
<li><a href="${ctx}/sys/user/modifyPwd" target="mainFrame"><i class="icon-lock"></i> <spring:message code="updatePwd"></spring:message></a></li>
|
||||
<li><a href="${pageContext.request.contextPath }/logout"
|
||||
title="退出登录"><i class="icon-key"></i> <spring:message
|
||||
code="exit"></spring:message></a></li>
|
||||
</ul></li>
|
||||
<!-- END USER LOGIN DROPDOWN -->
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
<!-- END TOP NAVIGATION MENU -->
|
||||
|
||||
|
||||
</div>
|
||||
<!-- END HEADER INNER -->
|
||||
</div>
|
||||
<!-- END HEADER -->
|
||||
|
||||
|
||||
<!-- BEGIN HEADER & CONTENT DIVIDER -->
|
||||
<div class="clearfix"></div>
|
||||
<!-- END HEADER & CONTENT DIVIDER -->
|
||||
<!-- BEGIN CONTAINER -->
|
||||
<div class="page-container">
|
||||
<!-- BEGIN SIDEBAR -->
|
||||
<div class="page-sidebar-wrapper">
|
||||
<!-- BEGIN SIDEBAR -->
|
||||
<div class="page-sidebar navbar-collapse collapse">
|
||||
|
||||
<ul
|
||||
class="page-sidebar-menu page-header-fixed page-sidebar-menu-light"
|
||||
data-keep-expanded="false" data-auto-scroll="true"
|
||||
data-slide-speed="200" style="padding-top: 0px">
|
||||
<li class="sidebar-toggler-wrapper hide">
|
||||
<div class="sidebar-toggler">
|
||||
<span></span>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li class="sidebar-search-wrapper">
|
||||
<form class="sidebar-search " action="page_general_search_3.html"
|
||||
method="POST">
|
||||
<a href="javascript:;" class="remove"> <i class="icon-close"></i>
|
||||
</a>
|
||||
<div class="input-group">
|
||||
<input class="form-control" placeholder="Search..." type="text">
|
||||
<span class="input-group-btn"> <a href="javascript:;"
|
||||
class="btn submit"> <i class="icon-magnifier"></i>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
|
||||
<%@include file="/WEB-INF/include/left_menu.jsp" %>
|
||||
|
||||
|
||||
<!-- END SIDEBAR MENU -->
|
||||
</div>
|
||||
<!-- END SIDEBAR -->
|
||||
</div>
|
||||
<!-- END SIDEBAR -->
|
||||
|
||||
|
||||
|
||||
<div class="page-content-wrapper">
|
||||
<div class="page-content">
|
||||
|
||||
<div class="page-bar">
|
||||
<ul class="page-breadcrumb">
|
||||
<li><a href="index.html">Home</a> <i class="fa fa-circle"></i>
|
||||
</li>
|
||||
<li><a href="#">Tables</a> <i class="fa fa-circle"></i></li>
|
||||
<li><span>Datatables</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
<iframe id="mainFrame" name="mainFrame" width="100%" onload="home.setIframeHeight(this)" src="${pageContext.request.contextPath }/nis/index" frameborder="0" srcolling="no">
|
||||
浏览器不支持嵌入式框架或配置为不显示嵌入式框架。
|
||||
</iframe>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
<!-- END CONTENT BODY -->
|
||||
</div>
|
||||
<!-- END CONTENT -->
|
||||
|
||||
</div>
|
||||
<!-- END CONTAINER -->
|
||||
|
||||
|
||||
<!-- BEGIN FOOTER -->
|
||||
<div class="page-footer">
|
||||
<div class="page-footer-inner">
|
||||
Copyright © 2015-${fns:getStringProperty('copyrightYear','2015')} ${fns:getStringProperty('productName','NIS')} - Powered By <a href="${pageContext.request.contextPath }" target="_blank">NIS</a> ${fns:getStringProperty('version','1.0')}
|
||||
</div>
|
||||
<div class="scroll-to-top">
|
||||
<i class="icon-arrow-up"></i>
|
||||
</div>
|
||||
</div>
|
||||
<!-- END FOOTER -->
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
},
|
||||
addTab:function($this,refresh) {
|
||||
$(".jericho_tab").show();
|
||||
$("#mainFrame").hide();
|
||||
$.fn.jerichoTab.addTab({
|
||||
tabFirer: $this,
|
||||
title: $this.text(),
|
||||
closeable: true,
|
||||
data: {
|
||||
dataType: 'iframe',
|
||||
dataLink: $this.attr('href')
|
||||
}
|
||||
}).loadData(refresh);
|
||||
return false;
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
}();
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
</body>
|
||||
|
||||
|
||||
</html>
|
||||
@@ -1,647 +0,0 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@ include file="/WEB-INF/include/taglib.jsp"%>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<c:set var="tabmode" value="${empty cookie.tabmode.value ? '1' : cookie.tabmode.value}"/>
|
||||
<c:set var="workNotifyRemindInterval" value="${fns:getStringProperty('work.notify.remind.interval','')}"/>
|
||||
<c:if test="${tabmode eq '1'}">
|
||||
<link rel="Stylesheet" href="${pageContext.request.contextPath}/static/jerichotab/css/jquery.jerichotab.css" />
|
||||
<script type="text/javascript" src="${pageContext.request.contextPath}/static/jerichotab/js/jquery.jerichotab.js"></script>
|
||||
</c:if>
|
||||
<link rel="shortcut icon" href="${pageContext.request.contextPath}/static/images/mvc_frame.ico"/>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<title>${fns:getStringProperty('productName','NIS')}</title>
|
||||
|
||||
<style type="text/css">
|
||||
#main {padding:0;margin:0;}
|
||||
#main .container-fluid{padding:0 4px 0 4px;}
|
||||
#header {margin:0 0 2px;position:static;}
|
||||
#header li {font-size:14px;_font-size:13px;}
|
||||
#header .brand {font-family:"Microsoft Yahei","微软雅黑",Helvetica, Arial, sans-serif, "宋体";font-size:26px;padding-left:33px;}
|
||||
#footer {margin:8px 0 0 0;padding:3px 0 0 0;font-size:11px;text-align:center;border-top:2px solid #0663A2;}
|
||||
#footer, #footer a {color:#999;} #left{overflow-x:hidden;overflow-y:auto;}
|
||||
#left .collapse{position:static;}
|
||||
|
||||
.accordion-heading .accordion-toggle .icon-chevron-left{
|
||||
margin-right:3px;
|
||||
display:inline;
|
||||
font-weight:300;
|
||||
float:right;
|
||||
display:inline;
|
||||
padding-top:2px;
|
||||
|
||||
}
|
||||
|
||||
.accordion-heading .accordion-toggle .icon-chevron-down{
|
||||
height:auto;
|
||||
margin-right:3px;
|
||||
display:inline;
|
||||
font-weight:300;
|
||||
float:right;
|
||||
display:inline;
|
||||
padding-top:2px;
|
||||
}
|
||||
#userControl {
|
||||
background-image: url(${ctxStatic}/images/bs_bannerright.jpg);
|
||||
background-repeat: no-repeat;
|
||||
|
||||
}
|
||||
#userControl>li>a{/*color:#fff;*/text-shadow:none;}
|
||||
#userControl>li>a:hover, #user #userControl>li.open>a{background:transparent;}
|
||||
|
||||
|
||||
|
||||
.header-left {
|
||||
display: block;
|
||||
float: left;
|
||||
margin-left: 1px;
|
||||
text-shadow: 0 1px 0 #ffffff;
|
||||
width: 608px;
|
||||
height:87px;
|
||||
background-image: url(${ctxStatic}/images/bs_bannerleft.jpg);
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
.nav-collapse {
|
||||
width:100%;
|
||||
height:87px;
|
||||
background-image: url(${ctxStatic}/images/bs_bannercenter.jpg);
|
||||
background-repeat: repeat;
|
||||
}
|
||||
#content {
|
||||
background: none repeat scroll 0 0 #eeeeee;
|
||||
margin-right: 0;
|
||||
position: relative;
|
||||
min-height:100%;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
||||
<div id="main">
|
||||
<!-- header -->
|
||||
<div id="header" class="navbar navbar-fixed-top">
|
||||
<div class="navbar-inner">
|
||||
<div class="header-left">
|
||||
|
||||
|
||||
<%-- <span id="productName"> ${fns:getStringProperty('productName','NIS')}</span> --%>
|
||||
|
||||
</div>
|
||||
<ul id="userControl" class="nav pull-right">
|
||||
|
||||
<li class="divider-vertical hidden-phone hidden-tablet"></li>
|
||||
|
||||
<li><a href="${pageContext.request.contextPath}/" title="访问网站主页"><i class="icon-home"></i></a></li>
|
||||
|
||||
<li id="userInfo" class="dropdown">
|
||||
<a class="dropdown-toggle" data-toggle="dropdown" href="#" title="个人信息">您好,${fns:getUser().name} <span id="notifyNum" class="label label-info hide"></span><b class="caret"></b></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="${ctx}/sys/user/info" target="mainFrame"><i class="icon-user"></i> 个人信息</a></li>
|
||||
<li><a href="${ctx}/sys/user/modifyPwd" target="mainFrame"><i class="icon-lock"></i> 修改密码</a></li>
|
||||
<li><a href="${ctx}oa/oaNotify/self" target="mainFrame"><i class="icon-bell"></i> 我的通知 <span id="notifyNum2" class="label label-info hide"></span></a></li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<li id="themeSwitch" class="dropdown">
|
||||
<a class="dropdown-toggle" data-toggle="dropdown" href="#" title="主题切换"><i class="icon-th-large"></i> <b class="caret"></b></a>
|
||||
<ul class="dropdown-menu">
|
||||
<c:forEach items="${fns:getDictList('SYS_THEME')}" var="dict">
|
||||
<li <c:if test="${cookie.theme.value eq dict.itemCode}">class='active'</c:if>>
|
||||
<a href="#" onclick="location='${pageContext.request.contextPath}/theme/${dict.itemCode}?url='+location.href">${dict.itemValue}</a>
|
||||
</li>
|
||||
</c:forEach>
|
||||
|
||||
<li><a href="javascript:cookie('tabmode','${tabmode eq '1' ? '0' : '1'}');location=location.href">${tabmode eq '1' ? '关闭' : '开启'}页签模式</a></li>
|
||||
</ul>
|
||||
<!--[if lte IE 6]><script type="text/javascript">$('#themeSwitch').hide();</script><![endif]-->
|
||||
</li>
|
||||
|
||||
|
||||
<li class="divider-vertical hidden-phone hidden-tablet"></li>
|
||||
|
||||
<li><a href="javascript:void(0);" class="tip-bottom" title="显示/隐藏快捷菜单"><i id="show-hide-option" class="icon-eye-open"></i></a></li>
|
||||
|
||||
<li><a href="${pageContext.request.contextPath }/logout" title="退出登录"><i class="icon-signout"></i> 退出</a></li>
|
||||
<li> </li>
|
||||
</ul>
|
||||
|
||||
<div class="nav-collapse">
|
||||
<ul id="menu" class="nav" style="*white-space:nowrap;float:none;">
|
||||
<c:forEach items="${fns:getMenuTreeList()}" var="menu" varStatus="idxStatus">
|
||||
|
||||
<c:if test="${menu.parent.id eq 1 && menu.isShow eq 1}">
|
||||
<li class="menu ${idxStatus.index eq 0 ? 'active' : ''}">
|
||||
<c:if test="${menu.href != null && menu.href != ''}" var="leafNodeFlag">
|
||||
<a class="menu" href="${ctx}${menu.href}" data-id="${menu.id}" target="mainFrame"><i class="${menu.icon } icon-white"></i> ${menu.name }</a>
|
||||
</c:if>
|
||||
|
||||
<c:if test="${!leafNodeFlag }">
|
||||
<a class="menu" href="javascript:void(0);" data-href="" data-id="${menu.id}"><i class="${menu.icon } icon-white"></i> ${menu.name}</a>
|
||||
</c:if>
|
||||
|
||||
|
||||
</li>
|
||||
</c:if>
|
||||
|
||||
|
||||
</c:forEach>
|
||||
|
||||
<li>
|
||||
<a href="documentation.html"><i class="icon-book icon-white"></i> 帮助</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- main content -->
|
||||
<div class="container-fluid">
|
||||
<div id="content" class="row-fluid">
|
||||
<div id="left">
|
||||
<!-- sidebar -->
|
||||
<c:forEach items="${fns:getMenuTreeList()}" var="menu" varStatus="idxStatus">
|
||||
<c:if test="${not empty menu.children }">
|
||||
<div id="menu-${menu.id }" class="accordion">
|
||||
|
||||
<c:forEach items="${menu.children}" var="secondMenu">
|
||||
<div class="accordion-group">
|
||||
<div class="accordion-heading">
|
||||
<a href="#collapse_${secondMenu.id}" data-parent="#menu-${menu.id }" data-toggle="collapse" class="accordion-toggle">
|
||||
${secondMenu.name} <i class="icon-chevron-left"></i>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="accordion-body collapse" id="collapse_${secondMenu.id}">
|
||||
<div class="accordion-inner">
|
||||
<ul class="nav nav-list">
|
||||
<c:forEach items="${secondMenu.children}" var="thirdMenu">
|
||||
<c:if test="${thirdMenu.href != null && thirdMenu.href != '' }">
|
||||
<li>
|
||||
<a href="${ctx}${thirdMenu.href}" data-id="${thirdMenu.id}" target="mainFrame"><i class="${not empty thirdMenu.icon?thirdMenu.icon:'icon-hide'} icon-white"></i> ${thirdMenu.name }</a>
|
||||
<ul style="margin:0;padding-right:0;" class="nav nav-list hide"></ul>
|
||||
</li>
|
||||
|
||||
</c:if>
|
||||
<!--
|
||||
<li class="divider"></li>
|
||||
-->
|
||||
</c:forEach>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</c:forEach>
|
||||
|
||||
|
||||
</div>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</div>
|
||||
|
||||
<div id="openClose" class="close"> </div>
|
||||
|
||||
<div id="right">
|
||||
<div class="quick-actions_homepage">
|
||||
<div id="quickMenu">
|
||||
<ul class="quick-actions">
|
||||
|
||||
<!-- <li class="bg_lb"> <a href="javascript:void(0);" onclick="go_home()"> <i class="icon-check"></i> 待办事项</a> </li> -->
|
||||
|
||||
<c:forEach items="${fns:getMenuTreeList()}" var="menu" varStatus="idxStatus">
|
||||
<c:if test="${not empty menu.children }">
|
||||
<c:forEach items="${menu.children}" var="secondMenu">
|
||||
|
||||
<c:if test="${not empty secondMenu.href and secondMenu.quickAction ne 0}">
|
||||
<c:if test="${secondMenu.quickAction==1}">
|
||||
<li class="${secondMenu.menuBg }">
|
||||
<a href="javascript:void(0);" onclick="page_turn('${menu.id}'+'_'+'${secondMenu.id}')"> <i class="${secondMenu.icon }"></i> ${secondMenu.name }
|
||||
<c:if test="${secondMenu.name eq '待办事项'}"><span id="notifyWorkedOption" class="label label-important hide"></span></c:if>
|
||||
</a>
|
||||
</li>
|
||||
</c:if>
|
||||
|
||||
<c:if test="${secondMenu.quickAction==2}">
|
||||
<li class="${secondMenu.menuBg } span3"> <a href="javascript:void(0);" onclick="page_turn('${menu.id}'+'_'+'${secondMenu.id}')">
|
||||
<i class="${secondMenu.icon }"></i> ${secondMenu.name } <c:if test="${secondMenu.name eq '待办事项'}"><span id="notifyWorkedOption" class="label label-important hide"></span></c:if></a> </li>
|
||||
</c:if>
|
||||
</c:if>
|
||||
|
||||
<c:forEach items="${secondMenu.children}" var="thirdMenu">
|
||||
<c:if test="${not empty thirdMenu.href and thirdMenu.quickAction ne 0}">
|
||||
<c:if test="${thirdMenu.quickAction==1}">
|
||||
<li class="${thirdMenu.menuBg }">
|
||||
<a href="javascript:void(0);" onclick="page_turn('${menu.id}'+'_'+'${secondMenu.id}'+'_'+'${thirdMenu.id}')"> <i class="${thirdMenu.icon }"></i> ${thirdMenu.name }
|
||||
<c:if test="${thirdMenu.name eq '待办事项'}"><span id="notifyWorkedOption" class="label label-important hide"></span></c:if>
|
||||
</a>
|
||||
</li>
|
||||
</c:if>
|
||||
|
||||
<c:if test="${thirdMenu.quickAction==2}">
|
||||
<li class="${thirdMenu.menuBg } span3">
|
||||
<a href="javascript:void(0);" onclick="page_turn('${menu.id}'+'_'+'${secondMenu.id}'+'_'+'${thirdMenu.id}')"> <i class="${thirdMenu.icon }"></i> ${thirdMenu.name }
|
||||
<c:if test="${thirdMenu.name eq '待办事项'}"><span id="notifyWorkedOption" class="label label-important hide"></span></c:if>
|
||||
</a>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:if>
|
||||
|
||||
</c:forEach>
|
||||
|
||||
|
||||
|
||||
</c:forEach>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<iframe id="mainFrame" name="mainFrame" src="" style="overflow:visible;" scrolling="yes" frameborder="no" width="100%">
|
||||
浏览器不支持嵌入式框架或配置为不显示嵌入式框架。
|
||||
</iframe>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div id="footer" class="row-fluid">
|
||||
Copyright © 2015-${fns:getStringProperty('copyrightYear','2015')} ${fns:getStringProperty('productName','NIS')} - Powered By <a href="${pageContext.request.contextPath }" target="_blank">NIS</a> ${fns:getStringProperty('version','1.0')}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
|
||||
$(document).ready(function(){
|
||||
App.init();
|
||||
});
|
||||
|
||||
|
||||
function page_turn(ids) {
|
||||
var ids = ids.split("_");
|
||||
$("#menu a.menu").filter("[data-id='"+ids[0]+"']").click();
|
||||
|
||||
var $secondMenu = $("#left .accordion-heading a").filter("[href='#collapse_"+ids[1]+"']");
|
||||
if (!$($secondMenu.attr("href")).hasClass('in')){
|
||||
$secondMenu.click();
|
||||
}
|
||||
|
||||
var $thirdMenu = $($secondMenu.attr("href")).find(".accordion-inner > ul > li > a ").filter("[data-id='"+ids[2]+"']");
|
||||
$thirdMenu.children("i").click();
|
||||
}
|
||||
|
||||
|
||||
var App = function() {
|
||||
|
||||
var leftWidth = 160; // 左侧窗口大小
|
||||
var tabTitleHeight = 33; // 页签的高度
|
||||
var htmlObj = $("html"), mainObj = $("#main");
|
||||
var headerObj = $("#header"), footerObj = $("#footer");
|
||||
var centerObj = $("#left, #openClose, #right");
|
||||
var frameObj = $("#right iframe");
|
||||
var quickObj = $("#right .quick-actions_homepage");
|
||||
|
||||
var handleResponsiveOnResize = function(){
|
||||
|
||||
$("#left").width(leftWidth);
|
||||
|
||||
$("#openClose").click(function(){
|
||||
if($(this).hasClass("close")){
|
||||
|
||||
$(this).removeClass("close").addClass("open");
|
||||
|
||||
$("#left").animate({width:0,opacity:"hide"});
|
||||
|
||||
$("#right").animate({width:$("#content").width()-$("#openClose").width()-5},function(){
|
||||
if(typeof openCloseClickCallBack=="function"){
|
||||
openCloseClickCallBack(true);
|
||||
}
|
||||
wSize();
|
||||
}
|
||||
)
|
||||
} else {
|
||||
$(this).removeClass("open").addClass("close");
|
||||
|
||||
$("#left").animate({width:leftWidth,opacity:"show"});
|
||||
|
||||
$("#right").animate({width:$("#content").width()-$("#openClose").width()-leftWidth-9},function(){
|
||||
if(typeof openCloseClickCallBack=="function"){
|
||||
openCloseClickCallBack(true);
|
||||
}
|
||||
wSize();
|
||||
}
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
if(!Array.prototype.map){
|
||||
Array.prototype.map=function(e,d){
|
||||
var a=[],b=0;
|
||||
for(var c=0,f=this.length;c<f;c++){
|
||||
if(c in this){
|
||||
a[b++]=e.call(d,this[c],c,this)
|
||||
}
|
||||
}
|
||||
return a;
|
||||
}
|
||||
}
|
||||
|
||||
$(window).resize(function(){wSize()});
|
||||
|
||||
wSize();
|
||||
}
|
||||
|
||||
|
||||
<c:if test="${tabmode eq '1'}">
|
||||
var openCloseClickCallBack = function(b){
|
||||
$.fn.jerichoTab.resize();
|
||||
}
|
||||
</c:if>
|
||||
|
||||
|
||||
var getWindowSize = function(){
|
||||
return["Height","Width"].map(function(a){
|
||||
return window["inner"+a]||document.compatMode==="CSS1Compat"&&document.documentElement["client"+a]||document.body["client"+a]});
|
||||
}
|
||||
|
||||
//主界面自适应大小
|
||||
var wSize = function(){
|
||||
var minHeight = 500, minWidth = 980;
|
||||
var strs = getWindowSize().toString().split(",");
|
||||
|
||||
htmlObj.css({"overflow-x":strs[1] < minWidth ? "auto" : "hidden", "overflow-y":strs[0] < minHeight ? "auto" : "hidden"});
|
||||
mainObj.css("width",strs[1] < minWidth ? minWidth - 10 : "auto");
|
||||
centerObj.height((strs[0] < minHeight ? minHeight : strs[0]) - headerObj.height() - footerObj.height() - (strs[1] < minWidth ? 42 : 28));
|
||||
|
||||
$("#openClose").height($("#openClose").height() - 5);
|
||||
|
||||
frameObj.height($("#right").height()-quickObj.height());
|
||||
|
||||
<c:if test="${tabmode eq '1'}">
|
||||
$(".jericho_tab iframe").height(0).height($("#right").height() - tabTitleHeight - quickObj.height());
|
||||
$('#jerichotab_contentholder').height(0).height($("#right").height() - tabTitleHeight - quickObj.height());
|
||||
</c:if>
|
||||
|
||||
wSizeWidth();
|
||||
|
||||
}
|
||||
|
||||
var wSizeWidth = function (){
|
||||
if (!$("#openClose").is(":hidden")){
|
||||
var leftWidth = ($("#left").width() < 0 ? 0 : $("#left").width());
|
||||
$("#right").width($("#content").width()- leftWidth - $("#openClose").width() -5);
|
||||
}else{
|
||||
$("#right").width("100%");
|
||||
}
|
||||
}
|
||||
|
||||
var sidebar_init = function() {
|
||||
menu_action_init();
|
||||
system_menu_default_page();
|
||||
}
|
||||
|
||||
//系统进入默认首页界面
|
||||
var system_menu_default_page = function() {
|
||||
var $topMenuFirst = $("#menu a.menu:first i").click();
|
||||
var menuId = "#menu-" + $topMenuFirst.parent().attr("data-id");
|
||||
// 初始化点击第一个二级菜单
|
||||
if (!$(menuId + " .accordion-body:first").hasClass('in')){
|
||||
$(menuId + " .accordion-heading:first a").click();
|
||||
}
|
||||
if (!$(menuId + " .accordion-body li:first ul:first").is(":visible")){
|
||||
var iobject = $(menuId + " .accordion-body a:first i");
|
||||
var aObject = $(menuId + " .accordion-body li:first a");
|
||||
$(menuId + " .accordion-body a:first i").click();
|
||||
}
|
||||
// 初始化点击第一个三级菜单
|
||||
$(menuId + " .accordion-body li:first li:first a:first").click();
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
//菜单选择触发事件
|
||||
var menu_action_init = function() {
|
||||
|
||||
// 绑定菜单单击事件
|
||||
$("#menu a.menu").click(function(){
|
||||
// 一级菜单焦点
|
||||
$("#menu li.menu").removeClass("active");
|
||||
|
||||
$(this).parent().addClass("active");
|
||||
|
||||
// 左侧区域隐藏
|
||||
if ($(this).attr("target") == "mainFrame"){
|
||||
$("#left,#openClose").hide();
|
||||
wSizeWidth();
|
||||
<c:if test="${tabmode eq '1'}"> // 隐藏页签
|
||||
$(".jericho_tab").hide();
|
||||
$("#mainFrame").show();
|
||||
</c:if>
|
||||
return true;
|
||||
}
|
||||
|
||||
// 左侧区域显示
|
||||
$("#left,#openClose").show();
|
||||
if(!$("#openClose").hasClass("close")){
|
||||
$("#openClose").click();
|
||||
}
|
||||
|
||||
// 显示二级菜单
|
||||
var menuId = "#menu-" + $(this).attr("data-id");
|
||||
//默认加载所有菜单
|
||||
if ($(menuId).length){
|
||||
$("#left .accordion").hide();
|
||||
$(menuId).show();
|
||||
} else {
|
||||
|
||||
// 获取二级菜单数据
|
||||
$.get($(this).attr("data-href"), function(data){
|
||||
if (data.indexOf("id=\"loginForm\"") != -1){
|
||||
alert('未登录或登录超时。请重新登录,谢谢!');
|
||||
top.location = "${pageContext.request.contextPath}/";
|
||||
return false;
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
// 大小宽度调整
|
||||
wSizeWidth();
|
||||
return false;
|
||||
|
||||
});
|
||||
|
||||
//快捷菜单显示隐藏动作
|
||||
$("#show-hide-option").click(function(event){
|
||||
|
||||
var disp = $("#quickMenu").css("display");
|
||||
if(!disp || disp == "block" ) {
|
||||
$("#quickMenu").slideUp(200,function(){
|
||||
$("#show-hide-option").removeClass().addClass("icon-eye-close");
|
||||
wSize();
|
||||
});
|
||||
|
||||
}else {
|
||||
$("#quickMenu").slideDown(200,function(){
|
||||
$("#show-hide-option").removeClass().addClass("icon-eye-open");
|
||||
wSize();
|
||||
});
|
||||
|
||||
}
|
||||
event.preventDefault();
|
||||
|
||||
});
|
||||
|
||||
|
||||
// 二级标题
|
||||
$("#left .accordion-heading a").click(function(){
|
||||
menu_header_active($(this));
|
||||
});
|
||||
|
||||
// 二级内容
|
||||
$("#left .accordion-body a").click(function(){
|
||||
var $sub_li = $("#left .accordion-body li");
|
||||
$sub_li.removeClass("active");
|
||||
$sub_li.children("i").removeClass("icon-white");
|
||||
$(this).parent().addClass("active");
|
||||
$(this).children("i").addClass("icon-white");
|
||||
});
|
||||
|
||||
// 展现三级
|
||||
$("#left .accordion-inner a").click(function(){
|
||||
var href = $(this).attr("data-href");
|
||||
if($(href).length > 0){
|
||||
$(href).toggle().parent().toggle();
|
||||
return false;
|
||||
}
|
||||
<c:if test="${tabmode eq '1'}"> //打开显示页签
|
||||
return App.addTab($(this));
|
||||
</c:if>
|
||||
});
|
||||
|
||||
|
||||
// 鼠标移动到边界自动弹出左侧菜单
|
||||
$("#openClose").mouseover(function(){
|
||||
if($(this).hasClass("open")){
|
||||
$(this).click();
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
|
||||
//左侧菜单标题点击时触发事件
|
||||
var menu_header_active = function($this){
|
||||
|
||||
var $flag = $this.children("i");
|
||||
|
||||
if($flag.hasClass("icon-chevron-down")){
|
||||
$flag.removeClass('icon-chevron-down').addClass('icon-chevron-left');
|
||||
return;
|
||||
}
|
||||
|
||||
var thisAccordion = $('#left');
|
||||
thisAccordion.find('.accordion-heading a').children("i").removeClass('icon-chevron-down').addClass('icon-chevron-left');
|
||||
|
||||
$flag.removeClass('icon-chevron-left').addClass('icon-chevron-down');
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
return {
|
||||
init:function(){
|
||||
|
||||
handleResponsiveOnResize();
|
||||
|
||||
// 链接去掉虚框
|
||||
$("#left a").bind("focus",function() {
|
||||
if(this.blur) {this.blur()};
|
||||
});
|
||||
|
||||
|
||||
<c:if test="${tabmode eq '1'}"> //初始化页签
|
||||
$.fn.initJerichoTab({
|
||||
renderTo: '#right', uniqueId: 'jerichotab',
|
||||
contentCss: { 'height': $('#right').height() - quickObj.height() - tabTitleHeight },
|
||||
tabs: [], loadOnce: true, tabWidth: 110, titleHeight: tabTitleHeight, quickActionMenu: "#right .quick-actions_homepage"
|
||||
});
|
||||
</c:if>
|
||||
|
||||
sidebar_init();
|
||||
|
||||
|
||||
<c:if test="${tabmode eq '1'}"> //下拉菜单以选项卡方式打开
|
||||
$("#userInfo .dropdown-menu a").mouseup(function(){
|
||||
return App.addTab($(this), true);
|
||||
});
|
||||
</c:if>
|
||||
|
||||
|
||||
App.getNotifyNum();
|
||||
|
||||
<c:if test="${workNotifyRemindInterval ne '' && workNotifyRemindInterval ne '0'}">
|
||||
setInterval(App.getNotifyNum, '${workNotifyRemindInterval}');
|
||||
</c:if>
|
||||
|
||||
|
||||
|
||||
},
|
||||
addTab:function($this,refresh) {
|
||||
$(".jericho_tab").show();
|
||||
$("#mainFrame").hide();
|
||||
$.fn.jerichoTab.addTab({
|
||||
tabFirer: $this,
|
||||
title: $this.text(),
|
||||
closeable: true,
|
||||
data: {
|
||||
dataType: 'iframe',
|
||||
dataLink: $this.attr('href')
|
||||
}
|
||||
}).loadData(refresh);
|
||||
return false;
|
||||
},
|
||||
getNotifyNum:function(){
|
||||
|
||||
$.get("${ctx}/sys/user/getToDoTaskNum?updateSession=0&t="+new Date().getTime(),function(data){
|
||||
var num = parseFloat(data);
|
||||
if (num > 0){
|
||||
$("#notifyWorkedOption").show().html(num);
|
||||
}else{
|
||||
$("#notifyWorkedOption").hide()
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
};
|
||||
|
||||
}();
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,472 +0,0 @@
|
||||
<%@ include file="/WEB-INF/include/taglib.jsp"%>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<title>${fns:getStringProperty('productName','NIS')}</title>
|
||||
|
||||
<style type="text/css">
|
||||
|
||||
#footer {margin:8px 0 0 0;padding:3px 0 0 0;font-size:11px;text-align:center;border-top:2px solid #0663A2;}
|
||||
#footer, #footer a {color:#999;}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="loading_layer" style="display:none"><img src="${pageContext.request.contextPath }/static/img/ajax_loader.gif" alt="" /></div>
|
||||
<div class="style_switcher">
|
||||
<div class="sepH_c">
|
||||
<p>Colors:</p>
|
||||
<div class="clearfix">
|
||||
<a href="javascript:void(0)" class="style_item jQclr blue_theme style_active" title="blue">blue</a>
|
||||
<a href="javascript:void(0)" class="style_item jQclr dark_theme" title="dark">dark</a>
|
||||
<a href="javascript:void(0)" class="style_item jQclr green_theme" title="green">green</a>
|
||||
<a href="javascript:void(0)" class="style_item jQclr brown_theme" title="brown">brown</a>
|
||||
<a href="javascript:void(0)" class="style_item jQclr eastern_blue_theme" title="eastern_blue">eastern blue</a>
|
||||
<a href="javascript:void(0)" class="style_item jQclr tamarillo_theme" title="tamarillo">tamarillo</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sepH_c">
|
||||
<p>Backgrounds:</p>
|
||||
<div class="clearfix">
|
||||
<span class="style_item jQptrn style_active ptrn_def" title=""></span>
|
||||
<span class="ssw_ptrn_a style_item jQptrn" title="ptrn_a"></span>
|
||||
<span class="ssw_ptrn_b style_item jQptrn" title="ptrn_b"></span>
|
||||
<span class="ssw_ptrn_c style_item jQptrn" title="ptrn_c"></span>
|
||||
<span class="ssw_ptrn_d style_item jQptrn" title="ptrn_d"></span>
|
||||
<span class="ssw_ptrn_e style_item jQptrn" title="ptrn_e"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sepH_c">
|
||||
<p>Layout:</p>
|
||||
<div class="clearfix">
|
||||
<label class="radio inline"><input type="radio" name="ssw_layout" id="ssw_layout_fluid" value="" checked /> Fluid</label>
|
||||
<label class="radio inline"><input type="radio" name="ssw_layout" id="ssw_layout_fixed" value="gebo-fixed" /> Fixed</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sepH_c">
|
||||
<p>Sidebar position:</p>
|
||||
<div class="clearfix">
|
||||
<label class="radio inline"><input type="radio" name="ssw_sidebar" id="ssw_sidebar_left" value="" checked /> Left</label>
|
||||
<label class="radio inline"><input type="radio" name="ssw_sidebar" id="ssw_sidebar_right" value="sidebar_right" /> Right</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sepH_c">
|
||||
<p>Show top menu on:</p>
|
||||
<div class="clearfix">
|
||||
<label class="radio inline"><input type="radio" name="ssw_menu" id="ssw_menu_click" value="" checked /> Click</label>
|
||||
<label class="radio inline"><input type="radio" name="ssw_menu" id="ssw_menu_hover" value="menu_hover" /> Hover</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="gh_button-group">
|
||||
<a href="#" id="showCss" class="btn btn-primary btn-mini">Show CSS</a>
|
||||
<a href="#" id="resetDefault" class="btn btn-mini">Reset</a>
|
||||
</div>
|
||||
<div class="hide">
|
||||
<ul id="ssw_styles">
|
||||
<li class="small ssw_mbColor sepH_a" style="display:none">body {<span class="ssw_mColor sepH_a" style="display:none"> color: #<span></span>;</span> <span class="ssw_bColor" style="display:none">background-color: #<span></span> </span>}</li>
|
||||
<li class="small ssw_lColor sepH_a" style="display:none">a { color: #<span></span> }</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="maincontainer" class="clearfix">
|
||||
<!-- header -->
|
||||
<header>
|
||||
<div class="navbar navbar-fixed-top">
|
||||
<div class="navbar-inner">
|
||||
<div class="container-fluid">
|
||||
<a class="brand" href="dashboard.html"><i class="icon-home icon-white"></i> Gebo Admin</a>
|
||||
<ul class="nav user_menu pull-right">
|
||||
<li class="hidden-phone hidden-tablet">
|
||||
<div class="nb_boxes clearfix">
|
||||
<a data-toggle="modal" data-backdrop="static" href="#myMail" class="label ttip_b" title="New messages">25 <i class="splashy-mail_light"></i></a>
|
||||
<a data-toggle="modal" data-backdrop="static" href="#myTasks" class="label ttip_b" title="New tasks">10 <i class="splashy-calendar_week"></i></a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="divider-vertical hidden-phone hidden-tablet"></li>
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle nav_condensed" data-toggle="dropdown"><i class="flag-gb"></i> <b class="caret"></b></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="javascript:void(0)"><i class="flag-de"></i> Deutsch</a></li>
|
||||
<li><a href="javascript:void(0)"><i class="flag-fr"></i> Français</a></li>
|
||||
<li><a href="javascript:void(0)"><i class="flag-es"></i> Español</a></li>
|
||||
<li><a href="javascript:void(0)"><i class="flag-ru"></i> Pусский</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="divider-vertical hidden-phone hidden-tablet"></li>
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown"><img src="${pageContext.request.contextPath }/static/img/user_avatar.png" alt="" class="user_avatar" /> Johny Smith <b class="caret"></b></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="user_profile.html">My Profile</a></li>
|
||||
<li><a href="javascrip:void(0)">Another action</a></li>
|
||||
<li class="divider"></li>
|
||||
<li><a href="${pageContext.request.contextPath }/logout">Log Out</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="nav" id="mobile-nav">
|
||||
|
||||
<c:forEach items="${fns:getMenuTreeList()}" var="menu" varStatus="idxStatus">
|
||||
|
||||
<c:if test="${empty menu.children}" var="subMenuFlag">
|
||||
<c:if test="${menu.isLeaf eq 1}">
|
||||
<li>
|
||||
<a href="${pageContext.request.contextPath }/${menu.menuUrl}" data-id="${menu.id}" target="mainFrame"><i class="${menu.menuClass } icon-white"></i> ${menu.menuName }</a>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:if>
|
||||
|
||||
<c:if test="${!subMenuFlag}">
|
||||
<li class="dropdown">
|
||||
<a data-toggle="dropdown" class="dropdown-toggle" data-id="${menu.id}" href="javascript:void(0);"><i class="${menu.menuClass}"></i> ${menu.menuName } <b class="caret"></b></a>
|
||||
<ul class="dropdown-menu">
|
||||
<c:forEach items="${menu.children}" var="secondMenu">
|
||||
<!-- 二级菜单 -->
|
||||
<c:if test="${empty secondMenu.children}" var="secondMenuFlag">
|
||||
<li><a href="${pageContext.request.contextPath }/${secondMenu.menuUrl}" data-id="${secondMenu.id}" target="mainFrame">${secondMenu.menuName }</a></li>
|
||||
</c:if>
|
||||
|
||||
<c:if test="${!secondMenuFlag}">
|
||||
|
||||
<li class="dropdown">
|
||||
<a href="javascript:void(0);" data-id="${secondMenu.id}">${secondMenu.menuName } <b class="caret-right"></b></a>
|
||||
<ul class="dropdown-menu">
|
||||
<!-- 第三级别菜单 -->
|
||||
<c:forEach items="${secondMenu.children}" var="thirdMenu">
|
||||
<c:if test="${thirdMenu.isLeaf == 1}">
|
||||
<li><a href="${pageContext.request.contextPath }/${thirdMenu.menuUrl}" data-id="${thirdMenu.id}" target="mainFrame">${thirdMenu.menuName }</a></li>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
</c:if>
|
||||
|
||||
|
||||
</c:forEach>
|
||||
</ul>
|
||||
</li>
|
||||
</c:if>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</c:forEach>
|
||||
|
||||
<li class="dropdown">
|
||||
<a data-toggle="dropdown" class="dropdown-toggle" href="#"><i class="icon-th icon-white"></i> Components <b class="caret"></b></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="alerts_btns.html">Alerts & Buttons</a></li>
|
||||
<li><a href="icons.html">Icons</a></li>
|
||||
<li><a href="notifications.html">Notifications</a></li>
|
||||
<li><a href="tables.html">Tables</a></li>
|
||||
<li><a href="tables_more.html">Tables (more examples)</a></li>
|
||||
<li><a href="tabs_accordion.html">Tabs & Accordion</a></li>
|
||||
<li><a href="tooltips.html">Tooltips, Popovers</a></li>
|
||||
<li><a href="typography.html">Typography</a></li>
|
||||
<li><a href="widgets.html">Widget boxes</a></li>
|
||||
<li class="dropdown">
|
||||
<a href="#">Sub menu <b class="caret-right"></b></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Sub menu 1.1</a></li>
|
||||
<li><a href="#">Sub menu 1.2</a></li>
|
||||
<li><a href="#">Sub menu 1.3</a></li>
|
||||
<li>
|
||||
<a href="#">Sub menu 1.4 <b class="caret-right"></b></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Sub menu 1.4.1</a></li>
|
||||
<li><a href="#">Sub menu 1.4.2</a></li>
|
||||
<li><a href="#">Sub menu 1.4.3</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<a href="documentation.html"><i class="icon-book icon-white"></i> Help</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal hide fade" id="myMail">
|
||||
<div class="modal-header">
|
||||
<button class="close" data-dismiss="modal">×</button>
|
||||
<h3>New messages</h3>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="alert alert-info">In this table jquery plugin turns a table row into a clickable link.</div>
|
||||
<table class="table table-condensed table-striped" data-provides="rowlink">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Sender</th>
|
||||
<th>Subject</th>
|
||||
<th>Date</th>
|
||||
<th>Size</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Declan Pamphlett</td>
|
||||
<td><a href="javascript:void(0)">Lorem ipsum dolor sit amet</a></td>
|
||||
<td>23/05/2012</td>
|
||||
<td>25KB</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Erin Church</td>
|
||||
<td><a href="javascript:void(0)">Lorem ipsum dolor sit amet</a></td>
|
||||
<td>24/05/2012</td>
|
||||
<td>15KB</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Koby Auld</td>
|
||||
<td><a href="javascript:void(0)">Lorem ipsum dolor sit amet</a></td>
|
||||
<td>25/05/2012</td>
|
||||
<td>28KB</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Anthony Pound</td>
|
||||
<td><a href="javascript:void(0)">Lorem ipsum dolor sit amet</a></td>
|
||||
<td>25/05/2012</td>
|
||||
<td>33KB</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a href="javascript:void(0)" class="btn">Go to mailbox</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal hide fade" id="myTasks">
|
||||
<div class="modal-header">
|
||||
<button class="close" data-dismiss="modal">×</button>
|
||||
<h3>New Tasks</h3>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="alert alert-info">In this table jquery plugin turns a table row into a clickable link.</div>
|
||||
<table class="table table-condensed table-striped" data-provides="rowlink">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>id</th>
|
||||
<th>Summary</th>
|
||||
<th>Updated</th>
|
||||
<th>Priority</th>
|
||||
<th>Status</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>P-23</td>
|
||||
<td><a href="javascript:void(0)">Admin should not break if URL…</a></td>
|
||||
<td>23/05/2012</td>
|
||||
<td class="tac"><span class="label label-important">High</span></td>
|
||||
<td>Open</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>P-18</td>
|
||||
<td><a href="javascript:void(0)">Displaying submenus in custom…</a></td>
|
||||
<td>22/05/2012</td>
|
||||
<td class="tac"><span class="label label-warning">Medium</span></td>
|
||||
<td>Reopen</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>P-25</td>
|
||||
<td><a href="javascript:void(0)">Featured image on post types…</a></td>
|
||||
<td>22/05/2012</td>
|
||||
<td class="tac"><span class="label label-success">Low</span></td>
|
||||
<td>Updated</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>P-10</td>
|
||||
<td><a href="javascript:void(0)">Multiple feed fixes and…</a></td>
|
||||
<td>17/05/2012</td>
|
||||
<td class="tac"><span class="label label-warning">Medium</span></td>
|
||||
<td>Open</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a href="javascript:void(0)" class="btn">Go to task manager</a>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<!-- main content -->
|
||||
<div id="contentwrapper" class="">
|
||||
|
||||
|
||||
<div class="main_content">
|
||||
<iframe id="mainFrame" name="mainFrame" src="" style="overflow:visible;" scrolling="yes" frameborder="no" width="100%" height="650">
|
||||
浏览器不支持嵌入式框架或配置为不显示嵌入式框架。
|
||||
</iframe>
|
||||
</div>
|
||||
|
||||
<!-- sidebar -->
|
||||
<a href="javascript:void(0)" class="sidebar_switch on_switch ttip_r" title="Hide Sidebar">Sidebar switch</a>
|
||||
<div class="sidebar">
|
||||
|
||||
<div class="antiScroll">
|
||||
<div class="antiscroll-inner">
|
||||
<div class="antiscroll-content">
|
||||
|
||||
<div class="sidebar_inner">
|
||||
<form action="search_page.html" class="input-append" method="post" >
|
||||
<input autocomplete="off" name="query" class="search_query input-medium" size="16" type="text" placeholder="Search..." /><button type="submit" class="btn"><i class="icon-search"></i></button>
|
||||
</form>
|
||||
|
||||
<div id="side_accordion" class="accordion">
|
||||
|
||||
<c:forEach items="${fns:getMenuTreeList()}" var="menu" varStatus="idxStatus">
|
||||
<div class="accordion-group">
|
||||
<div class="accordion-heading">
|
||||
<a href="#collapse_${menu.id}" data-parent="#side_accordion" data-toggle="collapse" class="accordion-toggle">
|
||||
<i class="${menu.menuClass }"></i> ${menu.menuName}
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="accordion-body collapse" id="collapse_${menu.id}">
|
||||
<div class="accordion-inner">
|
||||
<ul class="nav nav-list">
|
||||
|
||||
<c:if test="${empty menu.children}" var="subMenuFlag">
|
||||
<c:if test="${menu.isLeaf eq 1}">
|
||||
<li>
|
||||
<a href="${pageContext.request.contextPath }/${menu.menuUrl}" data-id="${menu.id}" target="mainFrame"><i class="${menu.menuClass }"></i> ${menu.menuName }</a>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:if>
|
||||
|
||||
|
||||
<c:if test="${!subMenuFlag}">
|
||||
<c:forEach items="${menu.children}" var="secondMenu">
|
||||
<!-- 二级菜单 -->
|
||||
<c:if test="${empty secondMenu.children}" var="secondMenuFlag">
|
||||
<li><a href="${pageContext.request.contextPath }/${secondMenu.menuUrl}" data-id="${secondMenu.id}" target="mainFrame">${secondMenu.menuName }</a></li>
|
||||
<li class="divider"></li>
|
||||
</c:if>
|
||||
|
||||
<c:if test="${!secondMenuFlag}">
|
||||
<li class="nav-header">${secondMenu.menuName }</li>
|
||||
|
||||
<!-- 第三级别菜单 -->
|
||||
<c:forEach items="${secondMenu.children}" var="thirdMenu">
|
||||
<c:if test="${thirdMenu.isLeaf == 1}">
|
||||
<li><a href="${pageContext.request.contextPath }/${thirdMenu.menuUrl}" data-id="${thirdMenu.id}" target="mainFrame">${thirdMenu.menuName }</a></li>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
<li class="divider"></li>
|
||||
|
||||
|
||||
|
||||
</c:if>
|
||||
|
||||
|
||||
</c:forEach>
|
||||
</c:if>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</c:forEach>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="accordion-group">
|
||||
<div class="accordion-heading">
|
||||
<a href="#collapseFour" data-parent="#side_accordion" data-toggle="collapse" class="accordion-toggle">
|
||||
<i class="icon-cog"></i> Configuration
|
||||
</a>
|
||||
</div>
|
||||
<div class="accordion-body collapse" id="collapseFour">
|
||||
<div class="accordion-inner">
|
||||
<ul class="nav nav-list">
|
||||
<li class="nav-header">People</li>
|
||||
<li class="active"><a href="javascript:void(0)">Account Settings</a></li>
|
||||
<li><a href="javascript:void(0)">IP Adress Blocking</a></li>
|
||||
<li class="nav-header">System</li>
|
||||
<li><a href="javascript:void(0)">Site information</a></li>
|
||||
<li><a href="javascript:void(0)">Actions</a></li>
|
||||
<li><a href="javascript:void(0)">Cron</a></li>
|
||||
<li class="divider"></li>
|
||||
<li><a href="javascript:void(0)">Help</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div class="push"></div>
|
||||
</div>
|
||||
|
||||
<div class="sidebar_info">
|
||||
<ul class="unstyled">
|
||||
<li>
|
||||
<span class="act act-warning">65</span>
|
||||
<strong>New comments</strong>
|
||||
</li>
|
||||
<li>
|
||||
<span class="act act-success">10</span>
|
||||
<strong>New articles</strong>
|
||||
</li>
|
||||
<li>
|
||||
<span class="act act-danger">85</span>
|
||||
<strong>New registrations</strong>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div id="footer" class="row-fluid">
|
||||
Copyright © <a href="http://jeesite.com" target="_blank">JeeSite</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -9,7 +9,11 @@
|
||||
<%@include file="/WEB-INF/include/header.jsp" %>
|
||||
<sitemesh:write property="head"/>
|
||||
</head>
|
||||
<body>
|
||||
<body >
|
||||
|
||||
<input id="metaId" type="hidden" value="<sitemesh:write property="body.id" />"/>
|
||||
<input id="metaClass" type="hidden" value="<sitemesh:write property="body.class" />"/>
|
||||
|
||||
<sitemesh:write property="body"/>
|
||||
</body>
|
||||
</html>
|
||||
@@ -3,79 +3,120 @@
|
||||
<%@ page import="org.apache.shiro.web.filter.authc.FormAuthenticationFilter"%>
|
||||
<%@ include file="/WEB-INF/include/taglib.jsp"%>
|
||||
<!DOCTYPE html>
|
||||
<!--[if IE 8]> <html class="ie8 no-js"> <![endif]-->
|
||||
<!--[if IE 9]> <html class="ie9 no-js"> <![endif]-->
|
||||
<!--[if !IE]><!-->
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="pragma" content="no-cache">
|
||||
<meta http-equiv="cache-control" content="no-cache">
|
||||
<meta http-equiv="expires" content="0">
|
||||
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
|
||||
<meta http-equiv="description" content="This is my page">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link rel="shortcut icon" href="${pageContext.request.contextPath}/static/images/mvc_frame.ico"/>
|
||||
<script src="${pageContext.request.contextPath }/static/jquery/jquery-1.8.3.min.js" type="text/javascript"></script>
|
||||
<link href="${pageContext.request.contextPath }/static/jquery-validation/1.11.0/jquery.validate.min.css" type="text/css" rel="stylesheet" />
|
||||
<script src="${pageContext.request.contextPath }/static/jquery-validation/1.11.0/jquery.validate.min.js" type="text/javascript"></script>
|
||||
<link href="${pageContext.request.contextPath }/static/common/login.css" type="text/css" rel="stylesheet" />
|
||||
<script src="${pageContext.request.contextPath }/static/common/cloud.js" type="text/javascript"></script>
|
||||
<title>${fns:getStringProperty('productName','NIS')}-登录平台</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="mainBody">
|
||||
<div id="cloud1" class="cloud"></div>
|
||||
<div id="cloud2" class="cloud"></div>
|
||||
</div>
|
||||
|
||||
<div class="loginbody">
|
||||
<span class="systemlogo"></span>
|
||||
<form id="loginForm" class="form-signin" action="${pageContext.request.contextPath }/login" method="post">
|
||||
<div class="loginbox loginbox2">
|
||||
<ul>
|
||||
<li><input id="username" name="username" type="text" class="loginuser required" value="${username}" placeholder="请填写登录账号"/></li>
|
||||
<li><input type="password" class="loginpwd required" id="password" name="password" placeholder="请填写登录密码"/></li>
|
||||
<c:if test="${not empty isValidateCodeLogin or isValidateCodeLogin==true}">
|
||||
<li class="yzm ${ (empty isValidateCodeLogin or isValidateCodeLogin==false) ?'hide':'' }">
|
||||
<span><input id="captcha" name="captcha" class="required" type="text" placeholder="验证码"/></span><cite><img alt="未获取验证码" src="${pageContext.request.contextPath}/captcha-image" id="captacha_image" class="mid"/></cite>
|
||||
</li>
|
||||
|
||||
</c:if>
|
||||
|
||||
|
||||
<li><input type="submit" class="loginbtn" value="登录"/>
|
||||
<label><input id="rememberMe" name="rememberMe" ${rememberMe ? 'checked' : ''} type="checkbox" />记住我(公共场所慎用)</label>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div class="bottom">
|
||||
<div id="messageBox" class="alert alert-error ${empty message ? 'hide' : ''}">
|
||||
<label id="loginError" class="error">${message}</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
|
||||
<!--<![endif]-->
|
||||
<!-- BEGIN HEAD -->
|
||||
|
||||
<div class="loginbm">
|
||||
Copyright © 2015-${fns:getStringProperty('copyrightYear','2015')} <a href="${pageContext.request.contextPath}">${fns:getStringProperty('productName','NIS')}</a> - Powered By <a href="${pageContext.request.contextPath}" target="_blank">NIS</a> ${fns:getStringProperty('version','1.0.0')}
|
||||
</div>
|
||||
<script src="${pageContext.request.contextPath}/static/flash/zoom.min.js" type="text/javascript"></script>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>Login</title>
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta content="width=device-width, initial-scale=1" name="viewport" />
|
||||
<meta content="" name="description" />
|
||||
<meta content="" name="author" />
|
||||
<!-- BEGIN GLOBAL MANDATORY STYLES -->
|
||||
<link href="${pageContext.request.contextPath}/static/global/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<link href="${pageContext.request.contextPath}/static/global/plugins/simple-line-icons/simple-line-icons.min.css" rel="stylesheet" type="text/css" />
|
||||
<link href="${pageContext.request.contextPath}/static/global/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<link href="${pageContext.request.contextPath}/static/global/plugins/bootstrap-switch/css/bootstrap-switch.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- END GLOBAL MANDATORY STYLES -->
|
||||
<!-- BEGIN THEME GLOBAL STYLES -->
|
||||
<link href="${pageContext.request.contextPath}/static/global/css/components.min.css" rel="stylesheet" id="style_components" type="text/css" />
|
||||
<link href="${pageContext.request.contextPath}/static/global/css/plugins.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- END THEME GLOBAL STYLES -->
|
||||
<!-- BEGIN PAGE LEVEL STYLES -->
|
||||
<link href="${pageContext.request.contextPath}/static/pages/css/login.css" rel="stylesheet" type="text/css" />
|
||||
<!-- END PAGE LEVEL STYLES -->
|
||||
<!-- BEGIN THEME LAYOUT STYLES -->
|
||||
<!-- END THEME LAYOUT STYLES -->
|
||||
<link rel="shortcut icon" href="favicon.ico" /> </head>
|
||||
<!-- END HEAD -->
|
||||
|
||||
<body class="">
|
||||
<div class="page-login">
|
||||
<div class="page-logo">
|
||||
<img src="${pageContext.request.contextPath}/static/pages/img/logo.png" alt="logo" />
|
||||
</div>
|
||||
<div class="page-body">
|
||||
<div class="login-head"> Login </div>
|
||||
<div class="login-body">
|
||||
<div class="pull-left login-avatar-block">
|
||||
<img src="${pageContext.request.contextPath}/static/pages/img/photo.jpg" class="login-avatar"> </div>
|
||||
<form id="loginForm" class="login-form pull-left" action="${pageContext.request.contextPath }/login" method="post">
|
||||
<div class="form-group">
|
||||
<input id="username" name="username" type="text" class="form-control placeholder-no-fix " value="${username}" placeholder="请填写登录账号"/>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<input type="password" class="form-control placeholder-no-fix " id="password" name="password" placeholder="请填写登录密码"/>
|
||||
</div>
|
||||
|
||||
<%-- <c:if test="${not empty isValidateCodeLogin or isValidateCodeLogin==true}">
|
||||
<li class="yzm ${ (empty isValidateCodeLogin or isValidateCodeLogin==false) ?'hide':'' }">
|
||||
<span><input id="captcha" name="captcha" class="required" type="text" placeholder="验证码"/></span><cite><img alt="未获取验证码" src="${pageContext.request.contextPath}/captcha-image" id="captacha_image" class="mid"/></cite>
|
||||
</li>
|
||||
|
||||
</c:if>
|
||||
|
||||
|
||||
<li><input type="submit" class="loginbtn" value="登录"/>
|
||||
<label><input id="rememberMe" name="rememberMe" ${rememberMe ? 'checked' : ''} type="checkbox" />记住我(公共场所慎用)</label>
|
||||
</li> --%>
|
||||
|
||||
<div class="form-actions">
|
||||
<button type="submit" class="btn red uppercase">Login</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="login-bottom">
|
||||
<a href="">Not Amanda Smith?</a>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<p>
|
||||
<div id="messageBox" class="alert alert-danger ${empty message ? 'hide' : ''}">
|
||||
<span class="label label-danger">ERROR: </span>
|
||||
<label id="loginError" class="error">${message}</label>
|
||||
</div>
|
||||
</p>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div class="page-footer-custom">
|
||||
Copyright © 2015-${fns:getStringProperty('copyrightYear','2015')} <a href="${pageContext.request.contextPath}">${fns:getStringProperty('productName','NIS')}</a> - Powered By <a href="${pageContext.request.contextPath}" target="_blank">NIS</a> ${fns:getStringProperty('version','1.0.0')}
|
||||
</div>
|
||||
|
||||
|
||||
<!--[if lt IE 9]>
|
||||
<script src="${pageContext.request.contextPath}/static/global/plugins/respond.min.js"></script>
|
||||
<script src="${pageContext.request.contextPath}/static/global/plugins/excanvas.min.js"></script>
|
||||
<![endif]-->
|
||||
<!-- BEGIN CORE PLUGINS -->
|
||||
<script src="${pageContext.request.contextPath}/static/global/plugins/jquery.min.js" type="text/javascript"></script>
|
||||
<script src="${pageContext.request.contextPath}/static/global/plugins/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<script src="${pageContext.request.contextPath}/static/global/plugins/js.cookie.min.js" type="text/javascript"></script>
|
||||
<script src="${pageContext.request.contextPath}/static/global/plugins/bootstrap-hover-dropdown/bootstrap-hover-dropdown.min.js" type="text/javascript"></script>
|
||||
<script src="${pageContext.request.contextPath}/static/global/plugins/jquery-slimscroll/jquery.slimscroll.min.js" type="text/javascript"></script>
|
||||
<script src="${pageContext.request.contextPath}/static/global/plugins/jquery.blockui.min.js" type="text/javascript"></script>
|
||||
<script src="${pageContext.request.contextPath}/static/global/plugins/bootstrap-switch/js/bootstrap-switch.min.js" type="text/javascript"></script>
|
||||
<!-- END CORE PLUGINS -->
|
||||
<!-- BEGIN THEME GLOBAL SCRIPTS -->
|
||||
<script src="${pageContext.request.contextPath}/static/global/scripts/app.min.js" type="text/javascript"></script>
|
||||
<!-- END THEME GLOBAL SCRIPTS -->
|
||||
<!-- BEGIN THEME LAYOUT SCRIPTS -->
|
||||
<!-- END THEME LAYOUT SCRIPTS -->
|
||||
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function(){
|
||||
|
||||
$('.loginbox').css({'position':'absolute','left':($(window).width()-692)/2});
|
||||
$(window).resize(function(){
|
||||
$('.loginbox').css({'position':'absolute','left':($(window).width()-692)/2});
|
||||
})
|
||||
|
||||
$("#captacha_image").on("click",function(){
|
||||
$(this).hide().attr("src","${pageContext.request.contextPath }/captcha-image?"+ Math.floor(Math.random()*100))
|
||||
.fadeIn();
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
$("#loginForm").validate({
|
||||
rules: {
|
||||
username: { required: true},
|
||||
@@ -103,6 +144,6 @@
|
||||
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,141 +0,0 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@ page import="org.apache.shiro.web.filter.authc.FormAuthenticationFilter"%>
|
||||
<%@ include file="/WEB-INF/include/taglib.jsp"%>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="pragma" content="no-cache">
|
||||
<meta http-equiv="cache-control" content="no-cache">
|
||||
<meta http-equiv="expires" content="0">
|
||||
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
|
||||
<meta http-equiv="description" content="This is my page">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link rel="shortcut icon" href="${pageContext.request.contextPath}/static/images/mvc_frame.ico"/>
|
||||
<%@include file="/WEB-INF/include/header.jsp" %>
|
||||
<title>登录平台</title>
|
||||
<style type="text/css">
|
||||
html,body,table{
|
||||
text-align:center;
|
||||
witdh:100%;
|
||||
height:100%;
|
||||
}
|
||||
.icon{
|
||||
background-image:url(${pageContext.request.contextPath }/static/images/u0.jpg);
|
||||
background-repeat: no-repeat;
|
||||
background-size:cover;
|
||||
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='${pageContext.request.contextPath }/static/images/u0.jpg',sizingMethod='scale');
|
||||
-moz-opacity:0.8;
|
||||
-khtml-opacity: 0.8;
|
||||
opacity: 0.8;
|
||||
|
||||
}
|
||||
.form-signin-heading{font-family:"Microsoft Yahei","微软雅黑",Helvetica, Arial, sans-serif, "宋体";font-size:36px;margin-bottom:20px;color:#0663a2;}
|
||||
.form-signin{position:relative;text-align:left;width:300px;padding:25px 29px 29px;margin:0 auto 20px;background-color:#fff;border:1px solid #e5e5e5;
|
||||
-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;-webkit-box-shadow:0 1px 2px rgba(0,0,0,.05);-moz-box-shadow:0 1px 2px rgba(0,0,0,.05);box-shadow:0 1px 2px rgba(0,0,0,.05);}
|
||||
.form-signin .checkbox{margin-bottom:10px;color:#0663a2;} .form-signin .input-label{font-size:16px;line-height:23px;color:#333333;}
|
||||
.form-signin .input-block-level{
|
||||
font-size:16px;
|
||||
height:auto;
|
||||
min-height:20px;
|
||||
margin-bottom:15px;
|
||||
padding:7px;
|
||||
*width:283px;
|
||||
*padding-bottom:0;
|
||||
_padding:7px 7px 9px 7px;
|
||||
}
|
||||
.form-signin .btn.btn-large{font-size:16px;} .form-signin #themeSwitch{position:absolute;right:15px;bottom:10px;}
|
||||
.form-signin div.validateCode {padding-bottom:15px;} .mid{vertical-align:middle;}
|
||||
.header{height:80px;padding-top:20px;} .alert{position:relative;width:300px;margin:0 auto;*padding-bottom:0px;}
|
||||
label.error{background:none;width:270px;font-weight:normal;color:inherit;margin:0;}
|
||||
#captacha_image {
|
||||
cursor:pointer;
|
||||
}
|
||||
</style>
|
||||
|
||||
</head>
|
||||
<body class="icon">
|
||||
|
||||
<div class="header">
|
||||
<div id="messageBox" class="alert alert-error ${empty message ? 'hide' : ''}">
|
||||
<label id="loginError" class="error">${message}</label>
|
||||
</div>
|
||||
</div>
|
||||
<h1 class="form-signin-heading">${fns:getStringProperty('productName','NIS')}</h1>
|
||||
<form id="loginForm" class="form-signin" action="${pageContext.request.contextPath }/login" method="post">
|
||||
<label class="input-label" for="username">登录名</label>
|
||||
<input type="text" id="username" name="username" class="input-block-level required" value="${username}" placeholder="请填写登录账号"/>
|
||||
<label class="input-label" for="password">密码</label>
|
||||
<input type="password" id="password" name="password" class="input-block-level required" placeholder="请填写登录密码"/>
|
||||
|
||||
<c:if test="${not empty isValidateCodeLogin or isValidateCodeLogin==true}">
|
||||
<div class="formRow ${ (empty isValidateCodeLogin or isValidateCodeLogin==false) ?'hide':'' }">
|
||||
<label class="input-label mid" for="captcha">验证码</label>
|
||||
<input type="text" id="captcha" name="captcha" maxlength="5" class="txt required" style="font-weight:bold;width:60px;margin-bottom:0;"/>
|
||||
<img alt="未获取验证码" src="${pageContext.request.contextPath}/captcha-image" id="captacha_image" class="mid"/>
|
||||
</div>
|
||||
|
||||
</c:if>
|
||||
<%--
|
||||
<label for="mobile" title="手机登录"><input type="checkbox" id="mobileLogin" name="mobileLogin" ${mobileLogin ? 'checked' : ''}/></label> --%>
|
||||
|
||||
<input class="btn btn-large btn-primary" type="submit" value="登 录"/>
|
||||
<label for="rememberMe" title="下次不需要再登录"><input type="checkbox" id="rememberMe" name="rememberMe" ${rememberMe ? 'checked' : ''}/> 记住我(公共场所慎用)</label>
|
||||
|
||||
<div id="themeSwitch" class="dropdown">
|
||||
<a class="dropdown-toggle" data-toggle="dropdown" href="#">${fns:getDictLabel('SYS_THEME', cookie.theme.value,'默认主题')}<b class="caret"></b></a>
|
||||
<ul class="dropdown-menu">
|
||||
<c:forEach items="${fns:getDictList('SYS_THEME')}" var="dict">
|
||||
<li <c:if test="${cookie.theme.value eq dict.itemCode}">class='active'</c:if>><a href="#" onclick="location='${pageContext.request.contextPath}/theme/${dict.itemCode}?url='+location.href">${dict.itemValue}</a></li>
|
||||
</c:forEach>
|
||||
</ul>
|
||||
<!--[if lte IE 6]><script type="text/javascript">$('#themeSwitch').hide();</script><![endif]-->
|
||||
</div>
|
||||
|
||||
</form>
|
||||
<div class="footer">
|
||||
<span>为了您有更好的体验,建议采用IE10以上浏览器!</span> <br>
|
||||
Copyright © 2015-${fns:getStringProperty('copyrightYear','2015')} <a href="${pageContext.request.contextPath}">${fns:getStringProperty('productName','NIS')}</a> - Powered By <a href="${pageContext.request.contextPath}" target="_blank">NIS</a> ${fns:getStringProperty('version','1.0.0')}
|
||||
</div>
|
||||
<script src="${pageContext.request.contextPath}/static/flash/zoom.min.js" type="text/javascript"></script>
|
||||
|
||||
<script>
|
||||
$(document).ready(function(){
|
||||
|
||||
$("#captacha_image").on("click",function(){
|
||||
$(this).hide().attr("src","${pageContext.request.contextPath }/captcha-image?"+ Math.floor(Math.random()*100))
|
||||
.fadeIn();
|
||||
});
|
||||
|
||||
|
||||
$("#loginForm").validate({
|
||||
rules: {
|
||||
username: { required: true},
|
||||
password: { required: true},
|
||||
captcha: {remote: "${pageContext.request.contextPath}/validateCode"}
|
||||
},
|
||||
messages: {
|
||||
username: {required: "请填写用户名."},password: {required: "请填写密码."},
|
||||
captcha: {remote: "验证码不正确.", required: "请填写验证码."}
|
||||
},
|
||||
errorLabelContainer: "#messageBox",
|
||||
errorPlacement: function(error, element) {
|
||||
error.appendTo($("#loginError").parent());
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
|
||||
// 如果在框架或在对话框中,则弹出提示并跳转到首页
|
||||
if(self.frameElement && self.frameElement.tagName == "IFRAME" || $('#left').length > 0 || $('.jbox').length > 0){
|
||||
alert('未登录或登录超时。请重新登录,谢谢!');
|
||||
top.location = "${pageContext.request.contextPath }";
|
||||
}
|
||||
|
||||
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -25,78 +25,140 @@
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<ul class="nav nav-tabs">
|
||||
<li><a href="${ctx}/sys/menu/">菜单列表</a></li>
|
||||
<li class="active"><a href="${ctx}/sys/menu/form?id=${menu.id}&parent.id=${menu.parent.id}">菜单<shiro:hasPermission name="sys:menu:edit">${not empty menu.id?'修改':'添加'}</shiro:hasPermission><shiro:lacksPermission name="sys:menu:edit">查看</shiro:lacksPermission></a></li>
|
||||
</ul><br/>
|
||||
<form:form id="inputForm" modelAttribute="menu" action="${ctx}/sys/menu/saveOrUpdate" method="post" class="form-horizontal">
|
||||
<form:hidden path="id"/>
|
||||
<sys:message content="${message}"/>
|
||||
<div class="control-group">
|
||||
<label class="control-label">上级菜单:</label>
|
||||
<div class="controls">
|
||||
<sys:treeselect id="menu" name="parent.id" value="${menu.parent.id}" labelName="parent.name" labelValue="${menu.parent.name}"
|
||||
title="菜单" url="/sys/menu/treeData" extId="${menu.id}" cssClass="required"/>
|
||||
|
||||
|
||||
<div class="page-content">
|
||||
|
||||
<div class="theme-panel hidden-xs hidden-sm">
|
||||
|
||||
<button type="button" class="btn btn-default" onclick="history.go(-1)"> 返回 </button>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<h3 class="page-title">
|
||||
菜单管理
|
||||
</h3>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="portlet box blue">
|
||||
<div class="portlet-title">
|
||||
<div class="caption">
|
||||
<i class="fa fa-gift"></i>菜单<shiro:hasPermission name="sys:menu:edit">${not empty menu.id?'修改':'添加'}</shiro:hasPermission><shiro:lacksPermission name="sys:menu:edit">查看</shiro:lacksPermission></div>
|
||||
<div class="tools">
|
||||
<a href="javascript:;" class="collapse"> </a>
|
||||
<a href="#portlet-config" data-toggle="modal" class="config"> </a>
|
||||
<a href="javascript:;" class="reload"> </a>
|
||||
<a href="javascript:;" class="remove"> </a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="portlet-body form">
|
||||
|
||||
|
||||
<div class="form-body">
|
||||
|
||||
<!-- BEGIN FORM-->
|
||||
<form:form id="inputForm" modelAttribute="menu" action="${ctx}/sys/menu/saveOrUpdate" method="post" class="form-horizontal">
|
||||
<form:hidden path="id"/>
|
||||
<sys:message content="${message}"/>
|
||||
<div class="form-group">
|
||||
<label class="col-md-3 control-label">上级菜单:</label>
|
||||
<div class="col-md-4">
|
||||
<sys:treeselect id="menu" name="parent.id" value="${menu.parent.id}" labelName="parent.name" labelValue="${menu.parent.name}"
|
||||
title="菜单" url="/sys/menu/treeData" extId="${menu.id}" cssClass="required form-control"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="col-md-3 control-label"><font color="red">*</font> 名称:</label>
|
||||
<div class="col-md-4">
|
||||
<form:input path="name" htmlEscape="false" maxlength="50" class="required form-control"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="col-md-3 control-label">链接:</label>
|
||||
<div class="col-md-4">
|
||||
<form:input path="href" htmlEscape="false" maxlength="2000" class="form-control"/>
|
||||
<span class="help-inline">点击菜单跳转的页面</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="col-md-3 control-label">目标:</label>
|
||||
<div class="col-md-4">
|
||||
<form:input path="target" htmlEscape="false" maxlength="10" class="form-control"/>
|
||||
<span class="help-inline">链接地址打开的目标窗口,默认:mainFrame</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-md-3 control-label">是否顶部导航菜单:</label>
|
||||
<div class="col-md-4">
|
||||
|
||||
<form:radiobutton path="isTop" value="1" />是
|
||||
<form:radiobutton path="isTop" value="0" checked="true"/>否
|
||||
<span class="help-inline">该菜单或操作是否顶部导航菜单</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-md-3 control-label">图标:</label>
|
||||
<div class="col-md-4">
|
||||
<sys:iconselect id="icon" name="icon" value="${menu.icon}"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="col-md-3 control-label">排序:</label>
|
||||
<div class="col-md-4">
|
||||
<form:input path="sort" htmlEscape="false" maxlength="50" class="required digits form-control"/>
|
||||
<span class="help-inline">排列顺序,升序。</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-md-3 control-label">可见:</label>
|
||||
<div class="col-md-4">
|
||||
<form:radiobuttons path="isShow" items="${fns:getDictList('SYS_SHOW_HIDE')}" itemLabel="itemValue" itemValue="itemCode" htmlEscape="false" class="required"/>
|
||||
<span class="help-inline">该菜单或操作是否显示到系统菜单中</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="col-md-3 control-label">权限标识:</label>
|
||||
<div class="col-md-4">
|
||||
<form:input path="permission" htmlEscape="false" maxlength="100" class="form-control"/>
|
||||
<span class="help-inline">控制器中定义的权限标识,如:@RequiresPermissions("权限标识")</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="col-md-3 control-label">备注:</label>
|
||||
<div class="col-md-4">
|
||||
<form:textarea path="remarks" htmlEscape="false" rows="3" maxlength="200" class="form-control"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="form-actions">
|
||||
<div class="row">
|
||||
<div class="col-md-offset-3 col-md-9">
|
||||
<shiro:hasPermission name="sys:menu:edit"><button type="submit" class="btn btn-circle blue"> 保存 </button></shiro:hasPermission>
|
||||
<button type="button" class="btn btn-circle grey-salsa btn-outline" onclick="history.go(-1)">Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form:form>
|
||||
<!-- END FORM-->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<label class="control-label">名称:</label>
|
||||
<div class="controls">
|
||||
<form:input path="name" htmlEscape="false" maxlength="50" class="required input-xlarge"/>
|
||||
<span class="help-inline"><font color="red">*</font> </span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<label class="control-label">链接:</label>
|
||||
<div class="controls">
|
||||
<form:input path="href" htmlEscape="false" maxlength="2000" class="input-xxlarge"/>
|
||||
<span class="help-inline">点击菜单跳转的页面</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<label class="control-label">目标:</label>
|
||||
<div class="controls">
|
||||
<form:input path="target" htmlEscape="false" maxlength="10" class="input-small"/>
|
||||
<span class="help-inline">链接地址打开的目标窗口,默认:mainFrame</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<label class="control-label">图标:</label>
|
||||
<div class="controls">
|
||||
<sys:iconselect id="icon" name="icon" value="${menu.icon}"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<label class="control-label">排序:</label>
|
||||
<div class="controls">
|
||||
<form:input path="sort" htmlEscape="false" maxlength="50" class="required digits input-small"/>
|
||||
<span class="help-inline">排列顺序,升序。</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<label class="control-label">可见:</label>
|
||||
<div class="controls">
|
||||
<form:radiobuttons path="isShow" items="${fns:getDictList('SYS_SHOW_HIDE')}" itemLabel="itemValue" itemValue="itemCode" htmlEscape="false" class="required"/>
|
||||
<span class="help-inline">该菜单或操作是否显示到系统菜单中</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<label class="control-label">权限标识:</label>
|
||||
<div class="controls">
|
||||
<form:input path="permission" htmlEscape="false" maxlength="100" class="input-xxlarge"/>
|
||||
<span class="help-inline">控制器中定义的权限标识,如:@RequiresPermissions("权限标识")</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<label class="control-label">备注:</label>
|
||||
<div class="controls">
|
||||
<form:textarea path="remarks" htmlEscape="false" rows="3" maxlength="200" class="input-xxlarge"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-actions">
|
||||
<shiro:hasPermission name="sys:menu:edit"><input id="btnSubmit" class="btn btn-primary" type="submit" value="保 存"/> </shiro:hasPermission>
|
||||
<input id="btnCancel" class="btn" type="button" value="返 回" onclick="history.go(-1)"/>
|
||||
</div>
|
||||
</form:form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -4,8 +4,9 @@
|
||||
<head>
|
||||
<title>菜单管理</title>
|
||||
|
||||
<link href="${ctxStatic}/treeTable/themes/vsStyle/treeTable.min.css" rel="stylesheet" type="text/css" />
|
||||
<script src="${ctxStatic}/treeTable/jquery.treeTable.min.js" type="text/javascript"></script>
|
||||
<link href="${ctxStatic}/global/plugins/treeTable/themes/vsStyle/treeTable.min.css" rel="stylesheet" type="text/css" />
|
||||
<script src="${ctxStatic}/global/plugins/treeTable/jquery.treeTable.min.js" type="text/javascript"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function() {
|
||||
$("#treeTable").treeTable({expandLevel : 3}).show();
|
||||
@@ -18,39 +19,85 @@
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<ul class="nav nav-tabs">
|
||||
<li class="active"><a href="${ctx}/sys/menu/">菜单列表</a></li>
|
||||
<shiro:hasPermission name="sys:menu:edit"><li><a href="${ctx}/sys/menu/form">菜单添加</a></li></shiro:hasPermission>
|
||||
</ul>
|
||||
<sys:message content="${message}"/>
|
||||
<form id="listForm" method="post">
|
||||
<table id="treeTable" class="table table-striped table-bordered table-condensed hide">
|
||||
<thead><tr><th>名称</th><th>链接</th><th style="text-align:center;">排序</th><th>可见</th><th>权限标识</th><shiro:hasPermission name="sys:menu:edit"><th>操作</th></shiro:hasPermission></tr></thead>
|
||||
<tbody><c:forEach items="${list}" var="menu">
|
||||
<tr id="${menu.id}" pId="${menu.parent.id ne 1?menu.parent.id:0}">
|
||||
<td nowrap><i class="icon-${not empty menu.icon?menu.icon:' hide'}"></i><a href="${ctx}/sys/menu/form?id=${menu.id}">${menu.name}</a></td>
|
||||
<td title="${menu.href}">${fns:abbr(menu.href,30)}</td>
|
||||
<td style="text-align:center;">
|
||||
<shiro:hasPermission name="sys:menu:edit">
|
||||
<input type="hidden" name="ids" value="${menu.id}"/>
|
||||
<input name="sorts" type="text" value="${menu.sort}" style="width:50px;margin:0;padding:0;text-align:center;">
|
||||
</shiro:hasPermission><shiro:lacksPermission name="sys:menu:edit">
|
||||
${menu.sort}
|
||||
</shiro:lacksPermission>
|
||||
</td>
|
||||
<td>${menu.isShow eq '1'?'显示':'隐藏'}</td>
|
||||
<td title="${menu.permission}">${fns:abbr(menu.permission,30)}</td>
|
||||
<shiro:hasPermission name="sys:menu:edit"><td nowrap>
|
||||
<a href="${ctx}/sys/menu/form?id=${menu.id}">修改</a>
|
||||
<a href="${ctx}/sys/menu/delete?id=${menu.id}" onclick="return confirmx('要删除该菜单及所有子菜单项吗?', this.href)">删除</a>
|
||||
<a href="${ctx}/sys/menu/form?parent.id=${menu.id}">添加下级菜单</a>
|
||||
</td></shiro:hasPermission>
|
||||
</tr>
|
||||
</c:forEach></tbody>
|
||||
</table>
|
||||
<shiro:hasPermission name="sys:menu:edit"><div class="form-actions pagination-left">
|
||||
<input id="btnSubmit" class="btn btn-primary" type="button" value="保存排序" onclick="updateSort();"/>
|
||||
</div></shiro:hasPermission>
|
||||
</form>
|
||||
<div class="page-content">
|
||||
<div class="theme-panel hidden-xs hidden-sm">
|
||||
|
||||
<button type="button" class="btn btn-default"> 刷新 </button>
|
||||
|
||||
<shiro:hasPermission name="sys:menu:edit"><button type="button" class="btn btn-primary"
|
||||
onClick="javascript:window.location='${ctx}/sys/menu/form'"> 新增菜单 </button></shiro:hasPermission>
|
||||
|
||||
</div>
|
||||
|
||||
<h3 class="page-title">
|
||||
菜单管理
|
||||
</h3>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="portlet box blue">
|
||||
<div class="portlet-title">
|
||||
<div class="caption">
|
||||
<i class="fa fa-cogs"></i>菜单列表
|
||||
</div>
|
||||
<div class="tools">
|
||||
<a href="javascript:;" class="collapse" data-original-title=""
|
||||
title=""> </a> <a href="#portlet-config" data-toggle="modal"
|
||||
class="config" data-original-title="" title=""> </a> <a
|
||||
href="javascript:;" class="reload" data-original-title=""
|
||||
title=""> </a> <a href="javascript:;" class="remove"
|
||||
data-original-title="" title=""> </a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="portlet-body">
|
||||
|
||||
|
||||
<div class="row" >
|
||||
|
||||
|
||||
<div class="col-md-12">
|
||||
|
||||
|
||||
<sys:message content="${message}"/>
|
||||
<form id="listForm" method="post">
|
||||
<table id="treeTable" class="table table-striped table-bordered table-condensed">
|
||||
<thead><tr><th>名称</th><th>链接</th><th style="text-align:center;">排序</th><th>可见</th><th>权限标识</th><shiro:hasPermission name="sys:menu:edit"><th>操作</th></shiro:hasPermission></tr></thead>
|
||||
<tbody><c:forEach items="${list}" var="menu">
|
||||
<tr id="${menu.id}" pId="${menu.parent.id ne 1?menu.parent.id:0}">
|
||||
<td nowrap><i class="icon-${not empty menu.icon?menu.icon:' hide'}"></i><a href="${ctx}/sys/menu/form?id=${menu.id}">${menu.name}</a></td>
|
||||
<td title="${menu.href}">${fns:abbr(menu.href,30)}</td>
|
||||
<td style="text-align:center;">
|
||||
<shiro:hasPermission name="sys:menu:edit">
|
||||
<input type="hidden" name="ids" value="${menu.id}"/>
|
||||
<input name="sorts" type="text" value="${menu.sort}" style="width:50px;margin:0;padding:0;text-align:center;">
|
||||
</shiro:hasPermission><shiro:lacksPermission name="sys:menu:edit">
|
||||
${menu.sort}
|
||||
</shiro:lacksPermission>
|
||||
</td>
|
||||
<td>${menu.isShow eq '1'?'显示':'隐藏'}</td>
|
||||
<td title="${menu.permission}">${fns:abbr(menu.permission,30)}</td>
|
||||
<shiro:hasPermission name="sys:menu:edit"><td nowrap>
|
||||
<a href="${ctx}/sys/menu/form?id=${menu.id}">修改</a>
|
||||
<a href="${ctx}/sys/menu/delete?id=${menu.id}" onclick="return confirmx('要删除该菜单及所有子菜单项吗?', this.href)">删除</a>
|
||||
<a href="${ctx}/sys/menu/form?parent.id=${menu.id}">添加下级菜单</a>
|
||||
</td></shiro:hasPermission>
|
||||
</tr>
|
||||
</c:forEach></tbody>
|
||||
</table>
|
||||
<shiro:hasPermission name="sys:menu:edit"><div class="form-actions pagination-left">
|
||||
<input id="btnSubmit" class="btn btn-primary" type="button" value="保存排序" onclick="updateSort();"/>
|
||||
</div></shiro:hasPermission>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -4,8 +4,10 @@
|
||||
<head>
|
||||
<title>角色管理</title>
|
||||
|
||||
<link href="${ctxStatic}/jquery-ztree/3.5.12/css/zTreeStyle/zTreeStyle.min.css" rel="stylesheet" type="text/css"/>
|
||||
<script src="${ctxStatic}/jquery-ztree/3.5.12/js/jquery.ztree.all-3.5.min.js" type="text/javascript"></script>
|
||||
<link href="${pageContext.request.contextPath}/static/global/plugins/jquery-ztree/3.5.12/css/zTreeStyle/zTreeStyle.min.css" rel="stylesheet" type="text/css"/>
|
||||
<script src="${pageContext.request.contextPath}/static/global/plugins/jquery-ztree/3.5.12/js/jquery.ztree.all-3.5.min.js" type="text/javascript"></script>
|
||||
|
||||
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function(){
|
||||
$("#name").focus();
|
||||
@@ -65,66 +67,119 @@
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<ul class="nav nav-tabs">
|
||||
<li><a href="${ctx}/sys/role/">角色列表</a></li>
|
||||
<li class="active"><a href="${ctx}/sys/role/form?id=${role.id}">角色<shiro:hasPermission name="sys:role:edit">${not empty role.id?'修改':'添加'}</shiro:hasPermission><shiro:lacksPermission name="sys:role:edit">查看</shiro:lacksPermission></a></li>
|
||||
</ul><br/>
|
||||
<form:form id="inputForm" modelAttribute="sysRole" action="${ctx}/sys/role/saveOrUpdate" method="post" class="form-horizontal">
|
||||
<form:hidden path="id"/>
|
||||
<sys:message content="${message}"/>
|
||||
|
||||
|
||||
<div class="page-content">
|
||||
|
||||
<div class="theme-panel hidden-xs hidden-sm">
|
||||
|
||||
<div class="control-group">
|
||||
<label class="control-label">角色名称:</label>
|
||||
<div class="controls">
|
||||
<input id="oldName" name="oldName" type="hidden" value="${role.name}">
|
||||
<form:input path="name" htmlEscape="false" maxlength="50" class="required"/>
|
||||
<span class="help-inline"><font color="red">*</font> </span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="control-group">
|
||||
<label class="control-label">角色类型:</label>
|
||||
<div class="controls"><%--
|
||||
<form:input path="roleType" htmlEscape="false" maxlength="50" class="required"/>
|
||||
<span class="help-inline" title="activiti有3种预定义的组类型:security-role、assignment、user 如果使用Activiti Explorer,需要security-role才能看到manage页签,需要assignment才能claim任务">
|
||||
工作流组用户组类型(security-role:管理员、assignment:可进行任务分配、user:普通用户)</span> --%>
|
||||
<form:select path="roleType" class="input-medium">
|
||||
<form:option value="assignment">任务分配</form:option>
|
||||
<form:option value="security-role">管理角色</form:option>
|
||||
<form:option value="user">普通角色</form:option>
|
||||
</form:select>
|
||||
<span class="help-inline" title="activiti有3种预定义的组类型:security-role、assignment、user 如果使用Activiti Explorer,需要security-role才能看到manage页签,需要assignment才能claim任务">
|
||||
工作流组用户组类型(任务分配:assignment、管理角色:security-role、普通角色:user)</span>
|
||||
</div>
|
||||
</div>
|
||||
<button type="button" class="btn btn-default" onclick="history.go(-1)"> 返回 </button>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div class="control-group">
|
||||
<label class="control-label">数据范围:</label>
|
||||
<div class="controls">
|
||||
<form:select path="dataScope" class="input-medium">
|
||||
<form:options items="${fns:getDictList('SYS_DATA_SCOPE')}" itemLabel="itemValue" itemValue="itemCode" htmlEscape="false"/>
|
||||
</form:select>
|
||||
<span class="help-inline">特殊情况下,设置为“按明细设置”,可进行跨机构授权</span>
|
||||
<h3 class="page-title">
|
||||
菜单管理
|
||||
</h3>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="portlet box blue">
|
||||
<div class="portlet-title">
|
||||
<div class="caption">
|
||||
<i class="fa fa-gift"></i>角色<shiro:hasPermission name="sys:role:edit">${not empty role.id?'修改':'添加'}</shiro:hasPermission><shiro:lacksPermission name="sys:role:edit">查看</shiro:lacksPermission></div>
|
||||
<div class="tools">
|
||||
<a href="javascript:;" class="collapse"> </a>
|
||||
<a href="#portlet-config" data-toggle="modal" class="config"> </a>
|
||||
<a href="javascript:;" class="reload"> </a>
|
||||
<a href="javascript:;" class="remove"> </a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="portlet-body form">
|
||||
|
||||
<div class="form-body">
|
||||
|
||||
<!-- BEGIN FORM-->
|
||||
<form:form id="inputForm" modelAttribute="sysRole" action="${ctx}/sys/role/saveOrUpdate" method="post" class="form-horizontal">
|
||||
<form:hidden path="id"/>
|
||||
<sys:message content="${message}"/>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-md-3 control-label">角色名称:</label>
|
||||
<div class="col-md-4">
|
||||
<input id="oldName" name="oldName" type="hidden" value="${role.name}">
|
||||
<form:input path="name" htmlEscape="false" maxlength="50" class="required form-control"/>
|
||||
<span class="help-inline"><font color="red">*</font> </span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-md-3 control-label">角色类型:</label>
|
||||
<div class="col-md-4"><%--
|
||||
<form:input path="roleType" htmlEscape="false" maxlength="50" class="required"/>
|
||||
<span class="help-inline" title="activiti有3种预定义的组类型:security-role、assignment、user 如果使用Activiti Explorer,需要security-role才能看到manage页签,需要assignment才能claim任务">
|
||||
工作流组用户组类型(security-role:管理员、assignment:可进行任务分配、user:普通用户)</span> --%>
|
||||
<form:select path="roleType" class="form-control">
|
||||
<form:option value="assignment">任务分配</form:option>
|
||||
<form:option value="security-role">管理角色</form:option>
|
||||
<form:option value="user">普通角色</form:option>
|
||||
</form:select>
|
||||
<span class="help-inline" title="activiti有3种预定义的组类型:security-role、assignment、user 如果使用Activiti Explorer,需要security-role才能看到manage页签,需要assignment才能claim任务">
|
||||
工作流组用户组类型(任务分配:assignment、管理角色:security-role、普通角色:user)</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-md-3 control-label">数据范围:</label>
|
||||
<div class="col-md-4">
|
||||
<form:select path="dataScope" class="form-control">
|
||||
<form:options items="${fns:getDictList('SYS_DATA_SCOPE')}" itemLabel="itemValue" itemValue="itemCode" htmlEscape="false"/>
|
||||
</form:select>
|
||||
<span class="help-inline">特殊情况下,设置为“按明细设置”,可进行跨机构授权</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="col-md-3 control-label">角色授权:</label>
|
||||
<div class="col-md-4">
|
||||
<div id="menuTree" class="ztree" style="margin-top:3px;float:left;"></div>
|
||||
<form:hidden path="menuIds"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="col-md-3 control-label">备注:</label>
|
||||
<div class="col-md-4">
|
||||
<form:textarea path="remark" htmlEscape="false" rows="3" maxlength="200" class="form-control"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="form-actions">
|
||||
<div class="row">
|
||||
<div class="col-md-offset-3 col-md-9">
|
||||
<shiro:hasPermission name="sys:role:edit"><button type="submit" class="btn btn-circle blue"> 保存 </button></shiro:hasPermission>
|
||||
<button type="button" class="btn btn-circle grey-salsa btn-outline" onclick="history.go(-1)">Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</form:form>
|
||||
|
||||
<!-- END FORM-->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<label class="control-label">角色授权:</label>
|
||||
<div class="controls">
|
||||
<div id="menuTree" class="ztree" style="margin-top:3px;float:left;"></div>
|
||||
<form:hidden path="menuIds"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<label class="control-label">备注:</label>
|
||||
<div class="controls">
|
||||
<form:textarea path="remark" htmlEscape="false" rows="3" maxlength="200" class="input-xlarge"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-actions">
|
||||
<shiro:hasPermission name="sys:role:edit"><input id="btnSubmit" class="btn btn-primary" type="submit" value="保 存"/> </shiro:hasPermission>
|
||||
<input id="btnCancel" class="btn" type="button" value="返 回" onclick="history.go(-1)"/>
|
||||
</div>
|
||||
</form:form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -5,25 +5,80 @@
|
||||
<title>角色管理</title>
|
||||
</head>
|
||||
<body>
|
||||
<ul class="nav nav-tabs">
|
||||
<li class="active"><a href="${ctx}/sys/role/">角色列表</a></li>
|
||||
<shiro:hasPermission name="sys:role:edit"><li><a href="${ctx}/sys/role/form">角色添加</a></li></shiro:hasPermission>
|
||||
|
||||
<div class="page-content">
|
||||
<div class="theme-panel hidden-xs hidden-sm">
|
||||
|
||||
<button type="button" class="btn btn-default"> 刷新 </button>
|
||||
|
||||
<shiro:hasPermission name="sys:role:edit">
|
||||
<button type="button" class="btn btn-primary"
|
||||
onClick="javascript:window.location='${ctx}/sys/role/form'"> 新增角色 </button>
|
||||
</shiro:hasPermission>
|
||||
</ul>
|
||||
<sys:message content="${message}"/>
|
||||
<table id="contentTable" class="table table-striped table-bordered table-condensed">
|
||||
<tr><th>角色名称</th><th>数据范围</th><th>描述</th><shiro:hasPermission name="sys:role:edit"><th>操作</th></shiro:hasPermission></tr>
|
||||
<c:forEach items="${list}" var="role">
|
||||
<tr>
|
||||
<td><a href="form?id=${role.id}">${role.name}</a></td>
|
||||
<td>${fns:getDictLabel('SYS_DATA_SCOPE',role.dataScope,'无')}</td>
|
||||
<td title="${role.remark}">${fns:abbr(role.remark,30)}</td>
|
||||
<shiro:hasPermission name="sys:role:edit"><td>
|
||||
<a href="${ctx}/sys/role/assign?id=${role.id}">分配</a>
|
||||
<a href="${ctx}/sys/role/form?id=${role.id}">修改</a>
|
||||
<a href="${ctx}/sys/role/delete?id=${role.id}" onclick="return confirmx('确认要删除该角色吗?', this.href)">删除</a>
|
||||
</td></shiro:hasPermission>
|
||||
</tr>
|
||||
</c:forEach>
|
||||
</table>
|
||||
|
||||
</div>
|
||||
|
||||
<h3 class="page-title">
|
||||
角色管理
|
||||
</h3>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="portlet box blue">
|
||||
<div class="portlet-title">
|
||||
<div class="caption">
|
||||
<i class="fa fa-cogs"></i>角色列表
|
||||
</div>
|
||||
<div class="tools">
|
||||
<a href="javascript:;" class="collapse" data-original-title=""
|
||||
title=""> </a> <a href="#portlet-config" data-toggle="modal"
|
||||
class="config" data-original-title="" title=""> </a> <a
|
||||
href="javascript:;" class="reload" data-original-title=""
|
||||
title=""> </a> <a href="javascript:;" class="remove"
|
||||
data-original-title="" title=""> </a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="portlet-body">
|
||||
|
||||
|
||||
<div class="row" >
|
||||
|
||||
|
||||
<div class="col-md-12">
|
||||
|
||||
|
||||
<sys:message content="${message}"/>
|
||||
<table id="contentTable" class="table table-striped table-bordered table-condensed">
|
||||
<tr><th>角色名称</th><th>数据范围</th><th>描述</th><shiro:hasPermission name="sys:role:edit"><th>操作</th></shiro:hasPermission></tr>
|
||||
<c:forEach items="${list}" var="role">
|
||||
<tr>
|
||||
<td><a href="form?id=${role.id}">${role.name}</a></td>
|
||||
<td>${fns:getDictLabel('SYS_DATA_SCOPE',role.dataScope,'无')}</td>
|
||||
<td title="${role.remark}">${fns:abbr(role.remark,30)}</td>
|
||||
<shiro:hasPermission name="sys:role:edit"><td>
|
||||
<a href="${ctx}/sys/role/assign?id=${role.id}">分配</a>
|
||||
<a href="${ctx}/sys/role/form?id=${role.id}">修改</a>
|
||||
<a href="${ctx}/sys/role/delete?id=${role.id}" onclick="return confirmx('确认要删除该角色吗?', this.href)">删除</a>
|
||||
</td></shiro:hasPermission>
|
||||
</tr>
|
||||
</c:forEach>
|
||||
</table>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,255 +0,0 @@
|
||||
@charset "utf-8";
|
||||
|
||||
/* CSS Document */
|
||||
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,
|
||||
form,fieldset,input,textarea,p,blockquote,th,td,img { padding: 0; margin: 0; }
|
||||
fieldset,img { border: 0; }
|
||||
address,caption,cite,code,dfn,em,strong,th,var,i { font-weight: normal; font-style: normal; }
|
||||
ol,ul,li { list-style: none; }
|
||||
caption,th { text-align: left; }
|
||||
h1,h2,h3,h4,h5,h6 { font-weight: normal; font-size: 100%; }
|
||||
q:before,q:after { content:''; }
|
||||
abbr,acronym { border: 0; }
|
||||
|
||||
/*-- All --*/
|
||||
html{ min-width:1000px; }
|
||||
body{ color:#333;font:12px/20px Arial,"Microsoft YaHei","宋体",sans-serif; text-align:center; background:#fff; }
|
||||
a{ color:#333; text-decoration:none; outline:none;}
|
||||
a:hover {color:#f00; text-decoration:underline; }
|
||||
table { border-collapse: collapse; border-spacing: 0; empty-cells:show; }
|
||||
table td,table th{ border:#ddd solid 1px; padding: 5px 0; }
|
||||
table th{ background:#39A4DC; color:#fff; }
|
||||
table .new td{ color:#f60; font-weight:bold; }
|
||||
|
||||
|
||||
/* css三角形 */
|
||||
.arrow,.arrow s { position:relative; display:block; font-size: 0; line-height: 0; width: 0; height: 0; border-color:transparent; border-style:dashed; border-width:5px; }
|
||||
.arrowR,.arrowR s{ border-left-color:#aaa; border-left-style:solid; }
|
||||
.arrowR s{ border-left-color:#fff; position:absolute; left:-7px; top:-5px; }
|
||||
.arrowR:hover{ border-left-color:#f60; }
|
||||
|
||||
.arrowL,.arrowL s{ border-right-color:#aaa; border-right-style:solid; }
|
||||
.arrowL s{ border-right-color:#fff; position:absolute; right:-7px; top:-5px; }
|
||||
.arrowL:hover{ border-right-color:#f60; }
|
||||
|
||||
.arrowT,.arrowT s{ border-bottom-color:#aaa; border-bottom-style:solid; }
|
||||
.arrowT s{ border-bottom-color:#fff; position:absolute; left:-5px; top:-3px; }
|
||||
.arrowT:hover{ border-bottom-color:#f60; }
|
||||
|
||||
.arrowB,.arrowB s{ border-top-color:#aaa; border-top-style:solid; }
|
||||
.arrowB s{ border-top-color:#fff; position:absolute; left:-5px; bottom:-3px; }
|
||||
.arrowB:hover{ border-top-color:#f60; }
|
||||
|
||||
/* css圆形 */
|
||||
.circle{ line-height:100%; overflow:hidden; font-family:Tahoma,Helvetica; font-size:18px; color:#aaa; }
|
||||
.circle:hover{ color:#f60; }
|
||||
|
||||
/* 顶部导航条 */
|
||||
#header{ width:100%; left:0; top:0; position:fixed; z-index:10; height:32px; line-height:32px; color:#fff; text-align:left; overflow:hidden; }
|
||||
#header .headerBg{ width:100%; height:32px; left:0; top:0; position:absolute; z-index:0; background:#000; filter:alpha(opacity=70);opacity:0.7; }
|
||||
#header a{ color:#fff; }
|
||||
#header #logo{ position:relative; z-index:1; display:inline-block; *display:inline; zoom:1; font-size:14px; margin-right:5px; padding-left:10px; }
|
||||
#header .nav{ position:relative; z-index:2; float:right; padding-right:10px; }
|
||||
#header .nav a{ padding:0 10px; }
|
||||
#header .nav a.imp{ color:#ff0; }
|
||||
#header .title{ position:relative; z-index:1; height:32px; overflow:hidden; }
|
||||
|
||||
#content{ margin:0 auto; padding:62px 30px 30px 30px; position:relative; text-align:left; z-index:0; }
|
||||
#footer{ height:34px; line-height:34px; text-align:center; }
|
||||
|
||||
/* 首页 - index.html ---------------------------------------------- */
|
||||
|
||||
|
||||
|
||||
.indBtn{ text-align:center; display:none; }
|
||||
.indBtn a{ vertical-align:middle; margin:15px 15px 0 0; display:inline-block; *display:inline; zoom:1; padding:14px 22px 3px 22px; line-height:26px;
|
||||
color:#bede9a; font-size:14px;
|
||||
-webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;
|
||||
background:#89c941;
|
||||
background: -webkit-gradient(linear, 0 0, 0 bottom, from(#89c941), to(#72b238));
|
||||
background: -webkit-linear-gradient(#89c941, #72b238);
|
||||
background: -moz-linear-gradient(#89c941, #72b238);
|
||||
background: -ms-linear-gradient(#89c941, #72b238);
|
||||
background: -o-linear-gradient(#89c941, #72b238);
|
||||
background: linear-gradient(#89c941, #72b238);
|
||||
-pie-background: linear-gradient(#89c941, #72b238);
|
||||
-webkit-box-shadow: #39591c 2px 2px 3px;
|
||||
-moz-box-shadow: #39591c 2px 2px 3px;
|
||||
box-shadow: #39591c 2px 2px 3px;
|
||||
}
|
||||
.indBtn a em{ font-size:30px; display:block; color:#fff; }
|
||||
.indIntro a:hover{ text-decoration:none; margin:11px 15px 0 0; }
|
||||
|
||||
.indTips{ position:fixed; _position:absolute; width:14px; right:0; top:90px; background:#333; padding:5px; line-height:18px; color:#fff; cursor:pointer;
|
||||
-webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px;
|
||||
}
|
||||
.indTips a{ color:#fff; text-decoration:none; }
|
||||
#indTips1{ display:none; }
|
||||
#ind2{ display:none; }
|
||||
#ind2 .topic{ font-size:60px; height:120px; line-height:120px; }
|
||||
|
||||
/* 参数 - param.html ---------------------------------------------- */
|
||||
.paramPage .param{ width:100%; margin-bottom:20px; background:#fff; }
|
||||
.paramPage .param th{ text-align:center; }
|
||||
.paramPage .param td{ text-align:left; padding:5px 2px; }
|
||||
.paramPage .param .intro{ text-align:left; }
|
||||
.paramPage .param .link{ color:#39A4DC; text-decoration:underline; }
|
||||
.paramPage .param .t b{ color:#f60; }
|
||||
.paramPage .param i{ color:#f60; }
|
||||
.paramPage .param .on td{ background:#ffffaa; }
|
||||
/*.paramPage .param tr.n td{ color:#999; }*/
|
||||
.paramPage .intro a{ text-decoration:underline; }
|
||||
.paramPage .notice{ overflow:hidden; text-align:left; padding-bottom:10px; }
|
||||
.paramPage .notice li{ width:120px; height:30px; line-height:30px; text-align:center; float:left; margin-right:10px; color:#fff; background:#666; cursor:pointer; }
|
||||
.paramPage .notice .on{ background:#f60; }
|
||||
|
||||
|
||||
/* 联系作者 ---------------------------------------------- */
|
||||
#content .contact{ display:none; color:#f60; margin-bottom:20px; }
|
||||
|
||||
|
||||
/* 案例 - demo.html ---------------------------------------------- */
|
||||
|
||||
.demoBox{ padding:0 20px 60px 20px; background:#f2f2f2; border-bottom:3px dotted #ccc; }
|
||||
.demoBox .hd{ padding:40px 10px 0 10px; }
|
||||
.demoBox .hd h3{ font-size:30px; font-weight:bold; color:#39A4DC; line-height:60px; }
|
||||
.demoBox .hd h3 span{ color:#ccc; font-style:italic; font-size:60px; }
|
||||
.demoBox .bd{ padding:20px; overflow:hidden; zoom:1; }
|
||||
.demoBox .bd .iframeWrap{ overflow:hidden; float:left; }
|
||||
.demoBox iframe{ width:100%; height:100%; vertical-align:middle; }
|
||||
.demoBox .botTit{ height:22px; line-height:22px; overflow:hidden; background:#eee; text-align:right; padding:5px 0; overflow:hidden; display:none;
|
||||
}
|
||||
.demoBox .botTit em{ float:left; font-weight:bold; padding-left:10px; }
|
||||
.demoBox .botTit span a{ display:block; float:right; height:20px; line-height:20px; padding:0 5px; background:#f60; margin-right:10px; color:#fff; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; cursor:pointer; display:none; }
|
||||
.demoBox .botTit span a:hover{ text-decoration:none; background:#f60; }
|
||||
|
||||
.params{ width:580px; height:100%; margin-left:20px; float:left; _display:inline; background:#fff; padding-bottom:10px; border:1px solid #ddd; }
|
||||
.params table{ background:#fff; }
|
||||
.params table .tit td{ padding: 5px 10px; background:#39A4DC; color:#fff; }
|
||||
.params table td{ border:1px solid #fff; }
|
||||
.params table .n{ width: 153px; text-align:right; }
|
||||
.params table .new{ color:#f00; }
|
||||
.params table i{ color:#999; }
|
||||
.params p{ padding:10px 0 0 10px; }
|
||||
.params .curJsCode{ color:#f60; display:block; font-family:SimSun; }
|
||||
|
||||
.rightNav{ position:fixed; width:140px; right:0; top:100px; _position:absolute; text-align:left; cursor:pointer; background-image:url(about:blank); }
|
||||
.rightNav a{ display:block; position:relative; height:30px; line-height:30px; margin-bottom:2px; background:#fff; padding-right:10px; width:130px; overflow:hidden; cursor:pointer; right:-110px; }
|
||||
.rightNav a:hover{ text-decoration:none; color:#39A4DC; }
|
||||
.rightNav a:hover em{ background:#00b700}
|
||||
.rightNav a em{ display:block; float:left; width:30px; background:#39A4DC; color:#fff; font-size:16px; text-align:center; margin-right:10px;}
|
||||
.rightNav a.new em{ background:#f60; }
|
||||
.demoBox .iframeWrap{ width:452px; }
|
||||
.demoBox .iframeWrap iframe{ width:452px; height:232px; background:url(images/loading.gif) center center no-repeat; }
|
||||
|
||||
#picScroll-left iframe{ height:174px; }
|
||||
#picScroll-top iframe{ height:415px; }
|
||||
#picMarquee-left iframe{ height:172px; }
|
||||
#picMarquee-top iframe{ height:415px; }
|
||||
#txtScroll-left iframe{ height:80px; }
|
||||
#txtScroll-top iframe{ height:182px; }
|
||||
#txtMarquee-left iframe{ height:107px; }
|
||||
#txtMarquee-top iframe{ height:184px; }
|
||||
#sideMenu iframe{ height:227px; }
|
||||
|
||||
|
||||
/* 隐藏代码盒子 */
|
||||
#displayBox{ z-index:10; display:none; position:fixed; _position:absolute; width:1000px; height:500px; left:50%; top:60px; margin-left:-500px; background:#fff;
|
||||
border:5px solid #eee;
|
||||
-webkit-box-shadow: #333 0 0 8px;
|
||||
-moz-box-shadow: #333 0 0 8px;
|
||||
box-shadow: #333 0 0 8px; }
|
||||
#displayBox .hd{ height:30px; line-height:30px; background:#eee; padding:0 10px; position:relative;
|
||||
background: -webkit-gradient(linear, 0 0, 0 bottom, from(#F7F7F7), to(#eee));
|
||||
background: -webkit-linear-gradient(#F7F7F7, #eee);
|
||||
background: -moz-linear-gradient(#F7F7F7, #eee);
|
||||
background: -ms-linear-gradient(#F7F7F7, #eee);
|
||||
background: -o-linear-gradient(#F7F7F7, #eee);
|
||||
background: linear-gradient(#F7F7F7, #eee);
|
||||
}
|
||||
#displayBox .hd h3{ font-weight:bold; color:#39A4DC; }
|
||||
#displayBox .hd a{ display:block; position:absolute; right:10px; top:7px; width:20px; height:16px; line-height:16px; text-align:center; background:#f60; color:#fff; cursor:pointer; }
|
||||
#displayBox .hd a:hover{ text-decoration:none; }
|
||||
#displayBox .bd{ padding:10px 0; background:#fff; }
|
||||
#displayBox textarea{ width:458px; height:230px; padding:10px; border:1px solid #ccc; display:block; }
|
||||
#displayBox .bd p{ padding-top:10px; }
|
||||
#displayBox iframe{ width:1000px; height:440px; margin:0 auto; }
|
||||
|
||||
|
||||
/* 扩展效果 ---------------------------------------------- */
|
||||
.authorWord{ margin-bottom:25px; text-align:left; background:#fff; }
|
||||
.authorWord h3{ padding:0 20px; height:30px; font:normal 14px/30px "Microsoft YaHei"; overflow:hidden; cursor:pointer; border-bottom:1px dotted #ccc; }
|
||||
.authorWord h3 .arrow{ float:right; border-top-color:#fff; margin-top:11px; }
|
||||
.authorWord .con{ padding:10px 20px; line-height:22px; }
|
||||
.authorWord .con p{ margin-bottom:5px }
|
||||
.authorWord a{ color:#f60; text-decoration:underline; }
|
||||
|
||||
.demoList{ overflow:hidden; padding-top:10px; }
|
||||
.demoList li{
|
||||
position:relative; cursor:pointer; float:left; width:160px; text-align:center; margin:0 30px 30px 0;
|
||||
padding:4px 4px 0 4px; background:#e3e3e3; color:#000;
|
||||
}
|
||||
.demoList li img{ display:block; width:160px; height:120px; background:url(images/loading.gif) center center no-repeat; }
|
||||
.demoList li h3{ height:28px; line-height:28px; }
|
||||
.demoList li.new i{ display:block; position:absolute; top:4px; right:4px; z-index:1; width:31px; height:31px; background:url(images/new.png) 0 0 no-repeat; }
|
||||
|
||||
.demoList li.on{
|
||||
background:#666; color:#fff;
|
||||
-webkit-transform: translateY(-10px);
|
||||
-moz-transform: translateY(-10px);
|
||||
-o-transform: translateY(-10px);
|
||||
-webkit-transition-duration:0.3s;
|
||||
-o-transition-duration:0.3s;
|
||||
-moz-transition-duration:0.3s;
|
||||
}
|
||||
|
||||
|
||||
.demoBoxEven{ background:#fff; }
|
||||
.demoBoxEven .demoList li{ }
|
||||
.demoBoxEven .demoList li.on{ background:#666; color:#fff; }
|
||||
|
||||
/* 如何使用 ---------------------------------------------- */
|
||||
.usePageDl{ width:1000px; }
|
||||
.usePageDl dt h2{ font:normal 22px/150% "Microsoft YaHei"; _font-weight:bold; color:#39A4DC; }
|
||||
.usePageDl dt h2 a{ color:#f60; text-decoration:underline; }
|
||||
.usePageDl dt p{ padding:5px 0 10px 33px; }
|
||||
.usePageDl dt p b{ color:#f60; }
|
||||
.usePageDl dd{ margin-bottom:50px; }
|
||||
.usePage .demoBox{ padding:0; }
|
||||
.usePage .demoBox .bd .iframeWrap{ background:none; }
|
||||
|
||||
|
||||
/* 下载页面 ----------------------------------------------- */
|
||||
.downLoadDl{ width:1000px; }
|
||||
.downLoadDl dt h2{ font:normal 22px/150% "Microsoft YaHei"; _font-weight:bold; color:#39A4DC; }
|
||||
.downLoadDl dt h2 a{ font-size:12px; color:#333; margin-left:20px; text-decoration:underline; }
|
||||
.downLoadDl dd{ margin-bottom:50px; padding:10px 0; }
|
||||
|
||||
.dBtn{ cursor:pointer; display:block; height:30px; line-height:30px; width:100px; text-align:center; font-size:16px; background:#6ddb00; color:#fff; _font-weight:bold;
|
||||
-webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px;
|
||||
-webkit-box-shadow: #666 1px 1px 2px;
|
||||
-moz-box-shadow: #666 1px 1px 2px;
|
||||
box-shadow: #666 1px 1px 2px;
|
||||
}
|
||||
.dBtn:hover{ text-decoration:none; background:#65ca00; color:#fff; margin-left:2px; }
|
||||
.pBtn{ background:#FFA241; font-size:12px; }
|
||||
.pBtn:hover{ background:#ff8635; }
|
||||
.pBtn i{ font-family:Arial; _font-weight:bold; font-size:20px; }
|
||||
|
||||
.downPage .inculde{ margin-top:20px; padding:10px; border:1px dotted #eee; background:#f3f3f3;}
|
||||
.downPage .inculde li{ color:#666; }
|
||||
.downPage .inculde em{ font-weight:bold; color:#333; }
|
||||
.downPage .inculde h3{ font-size:14px; font-weight:bold; color:#c00; padding-bottom:10px }
|
||||
.downPage .inculde a{ color:#39A4DC; text-decoration:underline; margin:0 2px; }
|
||||
#whyPay p,#howPay p{ text-indent:20px; margin-bottom:10px }
|
||||
|
||||
.pay{ overflow:hidden; padding-bottom:5px; vertical-align:top; }
|
||||
.pay .pBtn{ float:left; }
|
||||
.pay p{ margin-left:120px; }
|
||||
.pay p span{ color:#c00; }
|
||||
.downPage .imp{ color:#c00; font-size:14px; }
|
||||
|
||||
/* 颜色代码
|
||||
#39A4DC 浅蓝色
|
||||
|
||||
*/
|
||||
@@ -1,94 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,jQuery标签切换效果,Tab切换效果">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - Tab切换效果</title>
|
||||
<script type="text/javascript" src="../jquery1.42.min.js"></script><script type="text/javascript" src="../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
a:hover{ color:#1974A1; }
|
||||
|
||||
|
||||
/* 本例子css */
|
||||
.slideTxtBox{ width:450px; border:1px solid #ddd; text-align:left; }
|
||||
.slideTxtBox .hd{ height:30px; line-height:30px; background:#f4f4f4; padding:0 10px 0 20px; border-bottom:1px solid #ddd; position:relative; }
|
||||
.slideTxtBox .hd ul{ float:left; position:absolute; left:20px; top:-1px; height:32px; }
|
||||
.slideTxtBox .hd ul li{ float:left; padding:0 15px; cursor:pointer; }
|
||||
.slideTxtBox .hd ul li.on{ height:30px; background:#fff; border:1px solid #ddd; border-bottom:2px solid #fff; }
|
||||
.slideTxtBox .bd ul{ padding:15px; zoom:1; }
|
||||
.slideTxtBox .bd li{ height:24px; line-height:24px; }
|
||||
.slideTxtBox .bd li .date{ float:right; color:#999; }
|
||||
|
||||
/* 下面是前/后按钮代码,如果不需要删除即可 */
|
||||
.slideTxtBox .arrow{ position:absolute; right:10px; top:0; }
|
||||
.slideTxtBox .arrow a{ display:block; width:5px; height:9px; float:right; margin-right:5px; margin-top:10px; overflow:hidden;
|
||||
cursor:pointer; background:url("../images/arrow.png") 0 0 no-repeat; }
|
||||
.slideTxtBox .arrow .next{ background-position:0 -50px; }
|
||||
.slideTxtBox .arrow .prevStop{ background-position:-60px 0; }
|
||||
.slideTxtBox .arrow .nextStop{ background-position:-60px -50px; }
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
<div class="slideTxtBox">
|
||||
<div class="hd">
|
||||
|
||||
<!-- 下面是前/后按钮代码,如果不需要删除即可 -->
|
||||
<span class="arrow"><a class="next"></a><a class="prev"></a></span>
|
||||
|
||||
<ul><li>教育</li><li>培训</li><li>出国</li></ul>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">中国打破了世界软件巨头规则</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">口语:会说中文就能说英语!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">农场摘菜不如在线学外语好玩</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">数理化老师竟也看学习资料?</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">学英语送ipad2,45天突破听说</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">学外语,上北外!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">那些无法理解的荒唐事</a></li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">名师教作文:3妙招巧写高分</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">耶鲁小子:教你备考SAT</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">施强:高端专业语言教学</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">数理化老师竟也看学习资料?</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">【推荐】名校英语方法曝光!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">2012高考“考点”大曝光!!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">涨价仍爆棚假日旅游冰火两重天</a></li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">澳大利亚八大名校招生说明会</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">2012世界大学排名新鲜出炉</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">新加坡留学,国际双语课程</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">高考后留学日本名校随你选</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">教育培训行业优势资源推介</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">即刻预约今年最后一场教育展</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">女友坚持警局完婚不抛弃</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript">jQuery(".slideTxtBox").slide();</script>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
@@ -1,71 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,jQuery文字无缝滚动特效,javascript文字无缝滚动特效">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - 文字无缝滚动特效-上</title>
|
||||
<script type="text/javascript" src="../jquery1.42.min.js"></script><script type="text/javascript" src="../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
a:hover{ color:#1974A1; }
|
||||
|
||||
|
||||
/* 本例子css */
|
||||
.txtMarquee-top{ width:450px; overflow:hidden; position:relative; border:1px solid #ccc; }
|
||||
.txtMarquee-top .hd{ overflow:hidden; height:30px; background:#f4f4f4; padding:0 10px; }
|
||||
.txtMarquee-top .hd .prev,.txtMarquee-top .hd .next{ display:block; width:9px; height:5px; float:right; margin-right:5px; margin-top:10px; overflow:hidden;
|
||||
cursor:pointer; background:url("../images/arrow.png") 0 -100px no-repeat;}
|
||||
.txtMarquee-top .hd .next{ background-position:0 -140px; }
|
||||
.txtMarquee-top .hd .prevStop{ background-position:-60px -100px; }
|
||||
.txtMarquee-top .hd .nextStop{ background-position:-60px -140px; }
|
||||
.txtMarquee-top .bd{ padding:15px; }
|
||||
.txtMarquee-top .infoList li{ height:24px; line-height:24px; }
|
||||
.txtMarquee-top .infoList li .date{ float:right; color:#999; }
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
<div class="txtMarquee-top">
|
||||
<div class="hd">
|
||||
<a class="next"></a>
|
||||
<a class="prev"></a>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul class="infoList">
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">中国打破了世界软件巨头规则</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">口语:会说中文就能说英语!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">农场摘菜不如在线学外语好玩</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">数理化老师竟也看学习资料?</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">学英语送ipad2,45天突破听说</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">学外语,上北外!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">那些无法理解的荒唐事</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
jQuery(".txtMarquee-top").slide({mainCell:".bd ul",autoPlay:true,effect:"topMarquee",vis:5,interTime:50});
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
@@ -1,116 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,jQuery文字无缝滚动特效,javascript文字无缝滚动特效">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - 导航效果</title>
|
||||
<script type="text/javascript" src="../jquery1.42.min.js"></script><script type="text/javascript" src="../jquery.SuperSlide.2.1.js"></script>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
a:hover{ color:#1974A1; }
|
||||
|
||||
|
||||
/* 本例子css */
|
||||
.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
|
||||
.nav{ padding:0 20px; height:34px; line-height:34px; background:#39A4DC; position:relative; z-index:1; }
|
||||
.nav a{ color:#fff; }
|
||||
.nav .nLi{ float:left; position:relative; display:inline; }
|
||||
.nav .nLi h3{ float:left; }
|
||||
.nav .nLi h3 a{ display:block; padding:0 20px; font-size:14px; font-weight:bold; }
|
||||
.nav .sub{ display:none; width:100px; left:0; top:34px; position:absolute; background:#4E4E4E; line-height:26px; padding:5px 0; }
|
||||
.nav .sub li{ zoom:1; }
|
||||
.nav .sub a{ display:block; padding:0 10px; }
|
||||
.nav .sub a:hover{ background:#6d6d6d; color:#fff; }
|
||||
.nav .on h3 a{ background:#4E4E4E; color:#fff; }
|
||||
</style>
|
||||
|
||||
|
||||
<ul id="nav" class="nav clearfix">
|
||||
<li class="nLi">
|
||||
<h3><a href="http://www.SuperSlide2.com" target="_blank">首页</a></h3>
|
||||
</li>
|
||||
<li class="nLi">
|
||||
<h3><a href="http://www.SuperSlide2.com" target="_blank">新闻</a></h3>
|
||||
<ul class="sub">
|
||||
<li><a href="#">新闻首页</a></li>
|
||||
<li><a href="#">新闻人物</a></li>
|
||||
<li><a href="#">新闻电视</a></li>
|
||||
<li><a href="#">新闻图片</a></li>
|
||||
<li><a href="#">新闻视频</a></li>
|
||||
<li><a href="# ">新闻专题</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nLi on">
|
||||
<!-- 假设当前频道为“预告片”,手动或后台程序添加titOnClassName类名(默认是'on'),相当于设置参数defaultIndex:1。若同时设置参数returnDefault:true,则鼠标移走后0.3秒返回当前频道 -->
|
||||
<h3><a href="http://www.SuperSlide2.com" target="_blank">预告片</a></h3>
|
||||
<ul class="sub">
|
||||
<li><a href="#">新闻首页</a></li>
|
||||
<li><a href="#">新闻人物</a></li>
|
||||
<li><a href="#">新闻电视</a></li>
|
||||
<li><a href="#">新闻图片</a></li>
|
||||
<li><a href="#">新闻视频</a></li>
|
||||
<li><a href="# ">新闻专题</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nLi ">
|
||||
<h3><a href="http://www.SuperSlide2.com" target="_blank">影评</a></h3>
|
||||
<ul class="sub">
|
||||
<li><a href="#">新闻首页</a></li>
|
||||
<li><a href="#">新闻人物</a></li>
|
||||
<li><a href="#">新闻电视</a></li>
|
||||
<li><a href="#">新闻图片</a></li>
|
||||
<li><a href="#">新闻视频</a></li>
|
||||
<li><a href="# ">新闻专题</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nLi">
|
||||
<h3><a href="http://www.SuperSlide2.com" target="_blank">资料库</a></h3>
|
||||
<ul class="sub">
|
||||
<li><a href="#">新闻首页</a></li>
|
||||
<li><a href="#">新闻人物</a></li>
|
||||
<li><a href="#">新闻电视</a></li>
|
||||
<li><a href="#">新闻图片</a></li>
|
||||
<li><a href="#">新闻视频</a></li>
|
||||
<li><a href="# ">新闻专题</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
|
||||
<div class="intro" style="padding:10px">
|
||||
假设当前频道为“预告片”,</br>
|
||||
手动或后台程序添加titOnClassName类名(默认是'on'),相当于设置参数defaultIndex:2。</br>
|
||||
若同时设置参数returnDefault:true,则鼠标移走后返回当前频道。
|
||||
</div>
|
||||
|
||||
<script id="jsID" type="text/javascript">
|
||||
|
||||
jQuery("#nav").slide({
|
||||
type:"menu",// 效果类型,针对菜单/导航而引入的参数(默认slide)
|
||||
titCell:".nLi", //鼠标触发对象
|
||||
targetCell:".sub", //titCell里面包含的要显示/消失的对象
|
||||
effect:"slideDown", //targetCell下拉效果
|
||||
delayTime:300 , //效果时间
|
||||
triggerTime:0, //鼠标延迟触发时间(默认150)
|
||||
returnDefault:true //鼠标移走后返回默认状态,例如默认频道是“预告片”,鼠标移走后会返回“预告片”(默认false)
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
@@ -1,88 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,targetCell基础示例">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - targetCell基础示例</title>
|
||||
<script type="text/javascript" src="../jquery1.42.min.js"></script><script type="text/javascript" src="../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
.js{width:90%; margin:10px auto 0 auto; }
|
||||
.js p{ padding:5px 0; font-weight:bold; overflow:hidden; }
|
||||
.js p span{ float:right; }
|
||||
.js p span a{ color:#f00; text-decoration:underline; }
|
||||
.js textarea{ height:50px; width:98%; padding:5px; border:1px solid #ccc; border-top:2px solid #aaa; border-left:2px solid #aaa; }
|
||||
|
||||
|
||||
/* 本例子css */
|
||||
.sideMenu{ border:1px solid #ddd; }
|
||||
.sideMenu h3{ height:32px; line-height:32px; padding-left:10px; border-top:1px solid #e3e3e3; background:#f4f4f4; cursor:pointer;
|
||||
font:normal 14px/32px "Microsoft YaHei";
|
||||
}
|
||||
.sideMenu h3 em{ float:right; display:block; width:40px; height:32px; background:url(images/icoAdd.png) 16px 12px no-repeat; cursor:pointer; }
|
||||
.sideMenu h3.on em{ background-position:16px -57px; }
|
||||
.sideMenu ul{ padding:8px 25px; color:#999; display:none; /* 默认都隐藏 */ }
|
||||
|
||||
</style>
|
||||
|
||||
<div class="sideMenu" style="margin:0 auto">
|
||||
<h3><em></em>书签切换系列</h3>
|
||||
<ul>
|
||||
<li>淘宝首页右侧公告</li>
|
||||
<li>京东首页产品切换</li>
|
||||
<li>苏宁易购首页品牌切换</li>
|
||||
<li>1号店双重切换</li>
|
||||
<li>腾讯健康频道切换</li>
|
||||
</ul>
|
||||
|
||||
<h3 class="on"><em></em>幻灯片/焦点图系列</h3>
|
||||
<!-- 假设当前频道为“幻灯片/焦点图系列”,手动或后台程序添加titOnClassName类名(默认是'on'),相当于设置参数defaultIndex:1。若设置参数returnDefault:true,则鼠标移出.sideMen0.3秒可以返回当前频道 -->
|
||||
|
||||
<ul>
|
||||
<li>淘宝首页焦点图</li>
|
||||
<li>腾讯娱乐频道焦点图</li>
|
||||
<li>腾讯电影频道焦点图</li>
|
||||
<li>网易游戏频道焦点图</li>
|
||||
<li>易迅首页焦点图</li>
|
||||
</ul>
|
||||
<h3><em></em>带按钮切换</h3>
|
||||
<ul>
|
||||
<li>淘宝首页今日活动</li>
|
||||
<li>豆瓣读书频道</li>
|
||||
<li>天猫首页品牌切换</li>
|
||||
<li>格瓦拉首页活动进行中</li>
|
||||
<li>腾讯博客图片滚动</li>
|
||||
</ul>
|
||||
|
||||
|
||||
</div><!-- sideMenu End -->
|
||||
|
||||
<script type="text/javascript">
|
||||
jQuery(".sideMenu").slide({
|
||||
titCell:"h3", //鼠标触发对象
|
||||
targetCell:"ul", //与titCell一一对应,第n个titCell控制第n个targetCell的显示隐藏
|
||||
effect:"slideDown", //targetCell下拉效果
|
||||
delayTime:300 , //效果时间
|
||||
triggerTime:150, //鼠标延迟触发时间(默认150)
|
||||
defaultPlay:true,//默认是否执行效果(默认true)
|
||||
returnDefault:true //鼠标从.sideMen移走后返回默认状态(默认false)
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
@@ -1,74 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,jQuery焦点图/幻灯片">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - 焦点图/幻灯片</title>
|
||||
<script type="text/javascript" src="../jquery1.42.min.js"></script><script type="text/javascript" src="../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
|
||||
/* 本例子css */
|
||||
.slideBox{ width:450px; height:230px; overflow:hidden; position:relative; border:1px solid #ddd; }
|
||||
.slideBox .hd{ height:15px; overflow:hidden; position:absolute; right:5px; bottom:5px; z-index:1; }
|
||||
.slideBox .hd ul{ overflow:hidden; zoom:1; float:left; }
|
||||
.slideBox .hd ul li{ float:left; margin-right:2px; width:15px; height:15px; line-height:14px; text-align:center; background:#fff; cursor:pointer; }
|
||||
.slideBox .hd ul li.on{ background:#f00; color:#fff; }
|
||||
.slideBox .bd{ position:relative; height:100%; z-index:0; }
|
||||
.slideBox .bd li{ zoom:1; vertical-align:middle; }
|
||||
.slideBox .bd img{ width:450px; height:230px; display:block; }
|
||||
|
||||
/* 下面是前/后按钮代码,如果不需要删除即可 */
|
||||
.slideBox .prev,
|
||||
.slideBox .next{ position:absolute; left:3%; top:50%; margin-top:-25px; display:block; width:32px; height:40px; background:url(images/slider-arrow.png) -110px 5px no-repeat; filter:alpha(opacity=50);opacity:0.5; }
|
||||
.slideBox .next{ left:auto; right:3%; background-position:8px 5px; }
|
||||
.slideBox .prev:hover,
|
||||
.slideBox .next:hover{ filter:alpha(opacity=100);opacity:1; }
|
||||
.slideBox .prevStop{ display:none; }
|
||||
.slideBox .nextStop{ display:none; }
|
||||
|
||||
</style>
|
||||
|
||||
<div id="slideBox" class="slideBox">
|
||||
<div class="hd">
|
||||
<ul><li>1</li><li>2</li><li>3</li></ul>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic1.jpg" /></a></li>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic2.jpg" /></a></li>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic3.jpg" /></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- 下面是前/后按钮代码,如果不需要删除即可 -->
|
||||
<a class="prev" href="javascript:void(0)"></a>
|
||||
<a class="next" href="javascript:void(0)"></a>
|
||||
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
jQuery(".slideBox").slide({mainCell:".bd ul",autoPlay:true});
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
@@ -1,93 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,jQuery图片滚动特效,javascript图片滚动特效">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - 图片滚动特效-左</title>
|
||||
<script type="text/javascript" src="../jquery1.42.min.js"></script><script type="text/javascript" src="../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
|
||||
/* 本例子css */
|
||||
.picScroll-left{ width:450px; overflow:hidden; position:relative; border:1px solid #ccc; }
|
||||
.picScroll-left .hd{ overflow:hidden; height:30px; background:#f4f4f4; padding:0 10px; }
|
||||
.picScroll-left .hd .prev,.picScroll-left .hd .next{ display:block; width:5px; height:9px; float:right; margin-right:5px; margin-top:10px; overflow:hidden;
|
||||
cursor:pointer; background:url("images/arrow.png") no-repeat;}
|
||||
.picScroll-left .hd .next{ background-position:0 -50px; }
|
||||
.picScroll-left .hd .prevStop{ background-position:-60px 0; }
|
||||
.picScroll-left .hd .nextStop{ background-position:-60px -50px; }
|
||||
.picScroll-left .hd ul{ float:right; overflow:hidden; zoom:1; margin-top:10px; zoom:1; }
|
||||
.picScroll-left .hd ul li{ float:left; width:9px; height:9px; overflow:hidden; margin-right:5px; text-indent:-999px; cursor:pointer; background:url("images/icoCircle.gif") 0 -9px no-repeat; }
|
||||
.picScroll-left .hd ul li.on{ background-position:0 0; }
|
||||
.picScroll-left .bd{ padding:10px; }
|
||||
.picScroll-left .bd ul{ overflow:hidden; zoom:1; }
|
||||
.picScroll-left .bd ul li{ margin:0 8px; float:left; _display:inline; overflow:hidden; text-align:center; }
|
||||
.picScroll-left .bd ul li .pic{ text-align:center; }
|
||||
.picScroll-left .bd ul li .pic img{ width:120px; height:90px; display:block; padding:2px; border:1px solid #ccc; }
|
||||
.picScroll-left .bd ul li .pic a:hover img{ border-color:#999; }
|
||||
.picScroll-left .bd ul li .title{ line-height:24px; }
|
||||
|
||||
</style>
|
||||
|
||||
<div class="picScroll-left">
|
||||
<div class="hd">
|
||||
<a class="next"></a>
|
||||
<ul></ul>
|
||||
<a class="prev"></a>
|
||||
<span class="pageState"></span>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul class="picList">
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic4.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图4</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic5.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图5</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic6.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图6</a></div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
jQuery(".picScroll-left").slide({titCell:".hd ul",mainCell:".bd ul",autoPage:true,effect:"left",autoPlay:true,vis:3,trigger:"click"});
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
@@ -1,93 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,jQuery图片滚动特效,javascript图片滚动特效">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - 图片上滚动特效-上</title>
|
||||
<script type="text/javascript" src="../jquery1.42.min.js"></script><script type="text/javascript" src="../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
|
||||
/* 本例子css */
|
||||
.picScroll-top{ margin:0 auto; width:210px; overflow:hidden; position:relative; border:1px solid #ccc; }
|
||||
.picScroll-top .hd{ overflow:hidden; height:30px; background:#f4f4f4; padding:0 10px; }
|
||||
.picScroll-top .hd .prev,.picScroll-top .hd .next{ display:block; width:9px; height:5px; float:right; margin-right:5px; margin-top:10px; overflow:hidden;
|
||||
cursor:pointer; background:url("images/arrow.png") 0 -100px no-repeat;}
|
||||
.picScroll-top .hd .next{ background-position:0 -140px; }
|
||||
.picScroll-top .hd .prevStop{ background-position:-60px -100px; }
|
||||
.picScroll-top .hd .nextStop{ background-position:-60px -140px; }
|
||||
.picScroll-top .hd ul{ float:right; overflow:hidden; zoom:1; margin-top:10px; zoom:1; }
|
||||
.picScroll-top .hd ul li{ float:left; width:9px; height:9px; overflow:hidden; margin-right:5px; text-indent:-999px; cursor:pointer; background:url("images/icoCircle.gif") 0 -9px no-repeat; }
|
||||
.picScroll-top .hd ul li.on{ background-position:0 0; }
|
||||
.picScroll-top .bd{ padding:10px; }
|
||||
.picScroll-top .bd ul{ overflow:hidden; zoom:1; }
|
||||
.picScroll-top .bd ul li{ text-align:center; zoom:1; }
|
||||
.picScroll-top .bd ul li .pic{ text-align:center; }
|
||||
.picScroll-top .bd ul li .pic img{ width:180px; height:90px; display:block; padding:2px; border:1px solid #ccc; }
|
||||
.picScroll-top .bd ul li .pic a:hover img{ border-color:#999; }
|
||||
.picScroll-top .bd ul li .title{ line-height:24px; }
|
||||
|
||||
</style>
|
||||
|
||||
<div class="picScroll-top">
|
||||
<div class="hd">
|
||||
<a class="next"></a>
|
||||
<ul></ul>
|
||||
<a class="prev"></a>
|
||||
<span class="pageState"></span>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul class="picList">
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic4.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图4</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic5.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图5</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic6.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图6</a></div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
jQuery(".picScroll-top").slide({titCell:".hd ul",mainCell:".bd ul",autoPage:true,effect:"top",autoPlay:true,vis:3,trigger:"click"});
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
@@ -1,88 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,jQuery图片无缝滚动特效,javascript图片无缝滚动特效">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - 图片无缝滚动特效-左</title>
|
||||
<script type="text/javascript" src="../jquery1.42.min.js"></script><script type="text/javascript" src="../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
|
||||
/* 本例子css */
|
||||
.picMarquee-left{ width:450px; overflow:hidden; position:relative; border:1px solid #ccc; }
|
||||
.picMarquee-left .hd{ overflow:hidden; height:30px; background:#f4f4f4; padding:0 10px; }
|
||||
.picMarquee-left .hd .prev,.picMarquee-left .hd .next{ display:block; width:5px; height:9px; float:right; margin-right:5px; margin-top:10px; overflow:hidden;
|
||||
cursor:pointer; background:url("../images/arrow.png") no-repeat;}
|
||||
.picMarquee-left .hd .next{ background-position:0 -50px; }
|
||||
.picMarquee-left .hd .prevStop{ background-position:-60px 0; }
|
||||
.picMarquee-left .hd .nextStop{ background-position:-60px -50px; }
|
||||
.picMarquee-left .bd{ padding:10px; }
|
||||
.picMarquee-left .bd ul{ overflow:hidden; zoom:1; }
|
||||
.picMarquee-left .bd ul li{ margin:0 8px; float:left; _display:inline; overflow:hidden; text-align:center; }
|
||||
.picMarquee-left .bd ul li .pic{ text-align:center; }
|
||||
.picMarquee-left .bd ul li .pic img{ width:120px; height:90px; display:block; padding:2px; border:1px solid #ccc; }
|
||||
.picMarquee-left .bd ul li .pic a:hover img{ border-color:#999; }
|
||||
.picMarquee-left .bd ul li .title{ line-height:24px; }
|
||||
|
||||
</style>
|
||||
|
||||
<div class="picMarquee-left">
|
||||
<div class="hd">
|
||||
<a class="next"></a>
|
||||
<a class="prev"></a>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul class="picList">
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic4.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图4</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic5.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图5</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic6.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图6</a></div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
jQuery(".picMarquee-left").slide({mainCell:".bd ul",autoPlay:true,effect:"leftMarquee",vis:3,interTime:50});
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
@@ -1,88 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,jQuery图片无缝滚动特效,javascript图片无缝滚动特效">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - 图片无缝滚动特效-上</title>
|
||||
<script type="text/javascript" src="../jquery1.42.min.js"></script><script type="text/javascript" src="../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
|
||||
/* 本例子css */
|
||||
.picMarquee-top{ margin:0 auto; width:210px; overflow:hidden; position:relative; border:1px solid #ccc; }
|
||||
.picMarquee-top .hd{ overflow:hidden; height:30px; background:#f4f4f4; padding:0 10px; }
|
||||
.picMarquee-top .hd .prev,.picMarquee-top .hd .next{ display:block; width:9px; height:5px; float:right; margin-right:5px; margin-top:10px; overflow:hidden;
|
||||
cursor:pointer; background:url("../images/arrow.png") 0 -100px no-repeat;}
|
||||
.picMarquee-top .hd .next{ background-position:0 -140px; }
|
||||
.picMarquee-top .hd .prevStop{ background-position:-60px -100px; }
|
||||
.picMarquee-top .hd .nextStop{ background-position:-60px -140px; }
|
||||
.picMarquee-top .bd{ padding:10px; }
|
||||
.picMarquee-top .bd ul{ overflow:hidden; zoom:1; }
|
||||
.picMarquee-top .bd ul li{ text-align:center; zoom:1; }
|
||||
.picMarquee-top .bd ul li .pic{ text-align:center; }
|
||||
.picMarquee-top .bd ul li .pic img{ width:180px; height:90px; display:block; padding:2px; border:1px solid #ccc; }
|
||||
.picMarquee-top .bd ul li .pic a:hover img{ border-color:#999; }
|
||||
.picMarquee-top .bd ul li .title{ line-height:24px; }
|
||||
|
||||
</style>
|
||||
|
||||
<div class="picMarquee-top">
|
||||
<div class="hd">
|
||||
<a class="next"></a>
|
||||
<a class="prev"></a>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul class="picList">
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic4.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图4</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic5.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图5</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic6.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图6</a></div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
jQuery(".picMarquee-top").slide({mainCell:".bd ul",autoPlay:true,effect:"topMarquee",vis:3,interTime:50});
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
@@ -1,71 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,jQuery文字滚动特效,javascript文字滚动特效">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - 文字滚动特效-左</title>
|
||||
<script type="text/javascript" src="../jquery1.42.min.js"></script><script type="text/javascript" src="../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
a:hover{ color:#1974A1; }
|
||||
|
||||
/* 本例子css */
|
||||
.txtScroll-left{ width:450px; position:relative; border:1px solid #ccc; }
|
||||
.txtScroll-left .hd{ overflow:hidden; height:30px; background:#f4f4f4; padding:0 10px; }
|
||||
.txtScroll-left .hd .prev,.txtScroll-left .hd .next{ display:block; width:5px; height:9px; float:right; margin-right:5px; margin-top:10px; overflow:hidden; cursor:pointer; background:url("images/arrow.png") no-repeat;}
|
||||
.txtScroll-left .hd .next{ background-position:0 -50px; }
|
||||
.txtScroll-left .hd .prevStop{ background-position:-60px 0; }
|
||||
.txtScroll-left .hd .nextStop{ background-position:-60px -50px; }
|
||||
.txtScroll-left .hd ul{ float:right; overflow:hidden; zoom:1; margin-top:10px; }
|
||||
.txtScroll-left .hd ul li{ float:left; width:9px; height:9px; overflow:hidden; margin-right:5px; text-indent:-999px; cursor:pointer; background:url("images/icoCircle.gif") 0 -9px no-repeat; }
|
||||
.txtScroll-left .hd ul li.on{ background-position:0 0; }
|
||||
.txtScroll-left .bd{ padding:10px; width:430px; overflow:hidden; }
|
||||
.txtScroll-left .bd ul{ overflow:hidden; zoom:1; }
|
||||
.txtScroll-left .bd ul li{ margin-right:20px; float:left; height:24px; line-height:24px; text-align:left; _display:inline;}
|
||||
.txtScroll-left .bd ul li span{ color:#999; }
|
||||
</style>
|
||||
|
||||
<div class="txtScroll-left">
|
||||
<div class="hd">
|
||||
<a class="next"></a>
|
||||
<ul class="num"><li>1</li><li>2</li><li>3</li></ul>
|
||||
<a class="prev"></a>
|
||||
<span class="pageState"></span>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul class="infoList">
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank">中国打破了世界软件巨头规则</a><span>[11-11]</span></li>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank">施强:高端专业语言教学</a><span>[11-11]</span></li>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank">新加坡留学,国际双语课程</a><span>[11-11]</span></li>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank">高考后留学日本名校随你选</a><span>[11-11]</span></li>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank">教育培训行业优势资源推介</a><span>[11-11]</span></li>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank">女友坚持警局完婚不抛弃</a><span>[11-11]</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
jQuery(".txtScroll-left").slide({titCell:".hd ul",mainCell:".bd ul",autoPage:true,effect:"left",autoPlay:true,scroll:2,vis:2,trigger:"click"});
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
@@ -1,74 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,jQuery文字滚动特效,javascript文字滚动特效">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - 文字滚动特效-上</title>
|
||||
<script type="text/javascript" src="../jquery1.42.min.js"></script><script type="text/javascript" src="../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
a:hover{ color:#1974A1; }
|
||||
|
||||
|
||||
/* 本例子css */
|
||||
.txtScroll-top{ width:450px; overflow:hidden; position:relative; border:1px solid #ccc; }
|
||||
.txtScroll-top .hd{ overflow:hidden; height:30px; background:#f4f4f4; padding:0 10px; }
|
||||
.txtScroll-top .hd .prev,.txtScroll-top .hd .next{ display:block; width:9px; height:5px; float:right; margin-right:5px; margin-top:10px; overflow:hidden;
|
||||
cursor:pointer; background:url("images/icoUp.gif") no-repeat;}
|
||||
.txtScroll-top .hd .next{ background:url("images/icoDown.gif") no-repeat; }
|
||||
.txtScroll-top .hd ul{ float:right; overflow:hidden; zoom:1; margin-top:10px; }
|
||||
.txtScroll-top .hd ul li{ float:left; width:9px; height:9px; overflow:hidden; margin-right:5px; text-indent:-999px; cursor:pointer; background:url("images/icoCircle.gif") 0 -9px no-repeat; }
|
||||
.txtScroll-top .hd ul li.on{ background-position:0 0; }
|
||||
.txtScroll-top .bd{ padding:15px; }
|
||||
.txtScroll-top .infoList li{ height:24px; line-height:24px; }
|
||||
.txtScroll-top .infoList li .date{ float:right; color:#999; }
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
<div class="txtScroll-top">
|
||||
<div class="hd">
|
||||
<a class="next"></a>
|
||||
<ul></ul>
|
||||
<a class="prev"></a>
|
||||
<span class="pageState"></span>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul class="infoList">
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">中国打破了世界软件巨头规则</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">口语:会说中文就能说英语!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">农场摘菜不如在线学外语好玩</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">数理化老师竟也看学习资料?</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">学英语送ipad2,45天突破听说</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">学外语,上北外!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">那些无法理解的荒唐事</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
jQuery(".txtScroll-top").slide({titCell:".hd ul",mainCell:".bd ul",autoPage:true,effect:"top",autoPlay:true,vis:5});
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
@@ -1,68 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,jQuery文字无缝滚动特效,javascript文字无缝滚动特效">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - 文字无缝滚动特效-左</title>
|
||||
<script type="text/javascript" src="../jquery1.42.min.js"></script><script type="text/javascript" src="../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
a:hover{ color:#1974A1; }
|
||||
|
||||
/* 本例子css */
|
||||
.txtMarquee-left{ width:450px; position:relative; border:1px solid #ccc; }
|
||||
.txtMarquee-left .hd{ overflow:hidden; height:30px; background:#f4f4f4; padding:0 10px; }
|
||||
.txtMarquee-left .hd .prev,.txtMarquee-left .hd .next{ display:block; width:5px; height:9px; float:right; margin-right:5px; margin-top:10px; overflow:hidden; cursor:pointer; background:url("images/icoLeft.gif") no-repeat;}
|
||||
.txtMarquee-left .hd .next{ background:url("images/icoRight.gif") no-repeat; }
|
||||
.txtMarquee-left .bd{ padding:10px; }
|
||||
.txtMarquee-left .bd .tempWrap{ width:425px !important; }/* 用 !important覆盖SuperSlide自动生成的宽度,这样就可以手动控制可视宽度。 */
|
||||
.txtMarquee-left .bd ul{ overflow:hidden; zoom:1; }
|
||||
.txtMarquee-left .bd ul li{ margin-right:20px; float:left; height:24px; line-height:24px; text-align:left; _display:inline; width:auto !important; }/* 用 width:auto !important 覆盖SuperSlide自动生成的宽度,解决文字不衔接问题 */
|
||||
|
||||
|
||||
.txtMarquee-left .bd ul li span{ color:#999; }
|
||||
</style>
|
||||
|
||||
<div class="txtMarquee-left">
|
||||
<div class="hd">
|
||||
<a class="next"></a>
|
||||
<a class="prev"></a>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul class="infoList">
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank">中国打破了世界软件巨头规则</a><span>[11-11]</span></li>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank">施强:高端专业语言教学</a><span>[11-11]</span></li>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank">新加坡留学,国际双语课程</a><span>[11-11]</span></li>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank">高考后留学日本名校随你选</a><span>[11-11]</span></li>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank">教育培训行业优势资源推介</a><span>[11-11]</span></li>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank">女友坚持警局完婚不抛弃</a><span>[11-11]</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
jQuery(".txtMarquee-left").slide({mainCell:".bd ul",autoPlay:true,effect:"leftMarquee",vis:2,interTime:50});
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
@@ -1,163 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,SuperSlide多行滚动,jQuery多行滚动,javascript多行滚动">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - 多行滚动示例</title>
|
||||
<script type="text/javascript" src="../jquery1.42.min.js"></script><script type="text/javascript" src="../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
.js{width:90%; margin:10px auto 0 auto; }
|
||||
.js p{ padding:5px 0; font-weight:bold; overflow:hidden; }
|
||||
.js p span{ float:right; }
|
||||
.js p span a{ color:#f00; text-decoration:underline; }
|
||||
.js textarea{ height:50px; width:98%; padding:5px; border:1px solid #ccc; border-top:2px solid #aaa; border-left:2px solid #aaa; }
|
||||
|
||||
|
||||
/* 本例子css */
|
||||
.multipleLine{ overflow:hidden; position:relative; width:450px; border:1px solid #ccc; }
|
||||
.multipleLine .hd{ overflow:hidden; height:30px; background:#f4f4f4; padding:0 10px; }
|
||||
.multipleLine .hd .prev,.multipleLine .hd .next{ display:block; width:9px; height:5px; float:right; margin-right:5px; margin-top:10px; overflow:hidden;
|
||||
cursor:pointer; background:url("images/icoUp.gif") no-repeat;}
|
||||
.multipleLine .hd .next{ background:url("images/icoDown.gif") no-repeat; }
|
||||
.multipleLine .hd ul{ float:right; overflow:hidden; zoom:1; margin-top:10px; zoom:1; }
|
||||
.multipleLine .hd ul li{ float:left; width:9px; height:9px; overflow:hidden; margin-right:5px; text-indent:-999px; cursor:pointer; background:url("images/icoCircle.gif") 0 -9px no-repeat; }
|
||||
.multipleLine .hd ul li.on{ background-position:0 0; }
|
||||
.multipleLine .bd{ padding:10px; height:240px; overflow:hidden; }
|
||||
.multipleLine .bd ul{ overflow:hidden; zoom:1; margin-bottom:10px; }
|
||||
.multipleLine .bd ul li{ margin:0 8px; float:left; _display:inline; overflow:hidden; text-align:center; }
|
||||
.multipleLine .bd ul li .pic{ text-align:center; }
|
||||
.multipleLine .bd ul li .pic img{ width:120px; height:90px; display:block; padding:2px; border:1px solid #ccc; }
|
||||
.multipleLine .bd ul li .pic a:hover img{ border-color:#999; }
|
||||
.multipleLine .bd ul li .title{ line-height:24px; }
|
||||
|
||||
</style>
|
||||
|
||||
<div class="multipleLine" style="margin:0 auto">
|
||||
<div class="hd">
|
||||
<a class="next"></a>
|
||||
<ul></ul>
|
||||
<a class="prev"></a>
|
||||
<span class="pageState"></span>
|
||||
</div>
|
||||
<div class="bd">
|
||||
|
||||
<div class="ulWrap">
|
||||
|
||||
<ul><!-- 把每次滚动的n个li放到1个ul里面 -->
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1</a></div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<ul><!-- 把每次滚动的n个li放到1个ul里面 -->
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2</a></div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<ul><!-- 把每次滚动的n个li放到1个ul里面 -->
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3</a></div>
|
||||
</li>
|
||||
</ul>
|
||||
</div><!-- ulWrap End -->
|
||||
</div><!-- bd End -->
|
||||
</div><!-- multipleLine End -->
|
||||
|
||||
<script type="text/javascript">
|
||||
/*
|
||||
多行/多列的滚动解决思路在于:把每次滚动的n个li放到1个ul里面,然后用SuperSlide每次滚动1个ul,相当于每次滚动n个li
|
||||
*/
|
||||
jQuery(".multipleLine").slide({titCell:".hd ul",mainCell:".bd .ulWrap",autoPage:true,effect:"top",autoPlay:true});
|
||||
</script>
|
||||
|
||||
<div class="js">
|
||||
<p>多行/多列的滚动解决思路在于:把每次滚动的n个li放到1个ul里面,然后用SuperSlide每次滚动1个ul,相当于每次滚动n个li</p>
|
||||
<textarea>本例js调用:jQuery(".multipleLine").slide({titCell:".hd ul",mainCell:".bd .ulWrap",autoPage:true,effect:"top",autoPlay:true});</textarea>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
|
Before Width: | Height: | Size: 7.5 KiB |
@@ -1,156 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,SuperSlide多列滚动,jQuery多列滚动,javascript多列滚动">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - 多列滚动示例</title>
|
||||
<script type="text/javascript" src="../jquery1.42.min.js"></script><script type="text/javascript" src="../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
.js{width:90%; margin:10px auto 0 auto; }
|
||||
.js p{ padding:5px 0; font-weight:bold; overflow:hidden; }
|
||||
.js p span{ float:right; }
|
||||
.js p span a{ color:#f00; text-decoration:underline; }
|
||||
.js textarea{ height:50px; width:98%; padding:5px; border:1px solid #ccc; border-top:2px solid #aaa; border-left:2px solid #aaa; }
|
||||
|
||||
|
||||
/* 本例子css */
|
||||
.multipleColumn{ overflow:hidden; position:relative; width:870px; border:1px solid #ccc; }
|
||||
.multipleColumn .hd{ overflow:hidden; height:30px; background:#f4f4f4; padding:0 10px; }
|
||||
.multipleColumn .hd .prev,.multipleColumn .hd .next{ display:block; width:5px; height:9px; float:right; margin-right:5px; margin-top:10px; overflow:hidden;
|
||||
cursor:pointer; background:url("images/icoLeft.gif") no-repeat;}
|
||||
.multipleColumn .hd .next{ background:url("images/icoRight.gif") no-repeat; }
|
||||
.multipleColumn .hd ul{ float:right; overflow:hidden; zoom:1; margin-top:10px; zoom:1; }
|
||||
.multipleColumn .hd ul li{ float:left; width:9px; height:9px; overflow:hidden; margin-right:5px; text-indent:-999px; cursor:pointer; background:url("images/icoCircle.gif") 0 -9px no-repeat; }
|
||||
.multipleColumn .hd ul li.on{ background-position:0 0; }
|
||||
|
||||
.multipleColumn .bd{ padding:10px; overflow:hidden; }
|
||||
.multipleColumn .bd ul{ overflow:hidden; zoom:1; width:284px; float:left; _display:inline; }
|
||||
.multipleColumn .bd ul li{ margin:0 8px; float:left; _display:inline; overflow:hidden; text-align:center; }
|
||||
.multipleColumn .bd ul li .pic{ text-align:center; }
|
||||
.multipleColumn .bd ul li .pic img{ width:120px; height:90px; display:block; padding:2px; border:1px solid #ccc; }
|
||||
.multipleColumn .bd ul li .pic a:hover img{ border-color:#999; }
|
||||
.multipleColumn .bd ul li .title{ line-height:24px; }
|
||||
|
||||
</style>
|
||||
|
||||
<div class="multipleColumn" style="margin:0 auto">
|
||||
<div class="hd">
|
||||
<a class="next"></a>
|
||||
<ul></ul>
|
||||
<a class="prev"></a>
|
||||
<span class="pageState"></span>
|
||||
</div>
|
||||
<div class="bd">
|
||||
|
||||
<div class="ulWrap">
|
||||
|
||||
<ul><!-- 把每次滚动的n个li放到1个ul里面 -->
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1</a></div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<ul><!-- 把每次滚动的n个li放到1个ul里面 -->
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2</a></div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<ul><!-- 把每次滚动的n个li放到1个ul里面 -->
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3</a></div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<ul><!-- 把每次滚动的n个li放到1个ul里面 -->
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic4.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图4</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic4.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图4</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic4.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图4</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic4.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图4</a></div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</div><!-- ulWrap End -->
|
||||
</div><!-- bd End -->
|
||||
</div><!-- multipleColumn End -->
|
||||
|
||||
<script type="text/javascript">
|
||||
/*
|
||||
多行/多列的滚动解决思路在于:把每次滚动的n个li放到1个ul里面,然后用SuperSlide每次滚动1个ul,相当于每次滚动n个li
|
||||
*/
|
||||
jQuery(".multipleColumn").slide({titCell:".hd ul",mainCell:".bd .ulWrap",autoPage:true,effect:"leftLoop",autoPlay:true,vis:3});
|
||||
</script>
|
||||
|
||||
<div class="js">
|
||||
<p>多行/多列的滚动解决思路在于:把每次滚动的n个li放到1个ul里面,然后用SuperSlide每次滚动1个ul,相当于每次滚动n个li</p>
|
||||
<textarea>本例js调用:jQuery(".multipleColumn").slide({titCell:".hd ul",mainCell:".bd .ulWrap",autoPage:true,effect:"leftLoop",autoPlay:true,vis:3});</textarea>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
|
Before Width: | Height: | Size: 7.5 KiB |
@@ -1,81 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,targetCell基础示例">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - targetCell基础示例</title>
|
||||
<script type="text/javascript" src="../jquery1.42.min.js"></script><script type="text/javascript" src="../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
.js{width:90%; margin:10px auto 0 auto; }
|
||||
.js p{ padding:5px 0; font-weight:bold; overflow:hidden; }
|
||||
.js p span{ float:right; }
|
||||
.js p span a{ color:#f00; text-decoration:underline; }
|
||||
.js textarea{ height:50px; width:98%; padding:5px; border:1px solid #ccc; border-top:2px solid #aaa; border-left:2px solid #aaa; }
|
||||
|
||||
|
||||
/* 本例子css */
|
||||
.sideMen{ width:400px; border:1px solid #ddd; }
|
||||
.sideMen h3{ height:32px; line-height:32px; padding-left:10px; border-top:1px solid #e3e3e3; background:#f4f4f4;
|
||||
font:normal 14px/32px "Microsoft YaHei";
|
||||
}
|
||||
.sideMen h3 em{ float:right; display:block; width:40px; height:32px; background:url(images/icoAdd.png) 16px 12px no-repeat; cursor:pointer; }
|
||||
.sideMen h3 em.on{ background-position:16px -57px; }
|
||||
.sideMen ul{ padding:8px 25px; color:#999; }
|
||||
|
||||
</style>
|
||||
|
||||
<div class="sideMen" style="margin:0 auto">
|
||||
<h3><em></em>书签切换系列</h3>
|
||||
<ul>
|
||||
<li>淘宝首页右侧公告</li>
|
||||
<li>京东首页产品切换</li>
|
||||
<li>苏宁易购首页品牌切换</li>
|
||||
<li>1号店双重切换</li>
|
||||
<li>腾讯健康频道切换</li>
|
||||
</ul>
|
||||
<h3><em></em>幻灯片/焦点图系列</h3>
|
||||
<ul>
|
||||
<li>淘宝首页焦点图</li>
|
||||
<li>腾讯娱乐频道焦点图</li>
|
||||
<li>腾讯电影频道焦点图</li>
|
||||
<li>网易游戏频道焦点图</li>
|
||||
<li>易迅首页焦点图</li>
|
||||
</ul>
|
||||
<h3><em></em>带按钮切换</h3>
|
||||
<ul>
|
||||
<li>淘宝首页今日活动</li>
|
||||
<li>豆瓣读书频道</li>
|
||||
<li>天猫首页品牌切换</li>
|
||||
<li>格瓦拉首页活动进行中</li>
|
||||
<li>腾讯博客图片滚动</li>
|
||||
</ul>
|
||||
|
||||
</div><!-- sideMen End -->
|
||||
|
||||
<script type="text/javascript">
|
||||
jQuery(".sideMen").slide({titCell:"h3 em",targetCell:"ul",trigger:"click"});
|
||||
</script>
|
||||
|
||||
<div class="js">
|
||||
<p>本例js调用:</p>
|
||||
<textarea>jQuery(".sideMen").slide({titCell:"h3 em",targetCell:"ul",trigger:"click"});</textarea>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
|
Before Width: | Height: | Size: 6.9 KiB |
@@ -1,166 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,SuperSlide组合应用基础示例">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - SuperSlide组合应用基础示例</title>
|
||||
<script type="text/javascript" src="../jquery1.42.min.js"></script><script type="text/javascript" src="../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
a:hover{ color:#1974A1; }
|
||||
.js{width:90%; margin:10px auto 0 auto; }
|
||||
.js p{ padding:5px 0; font-weight:bold; overflow:hidden; }
|
||||
.js p span{ float:right; }
|
||||
.js p span a{ color:#f00; text-decoration:underline; }
|
||||
.js textarea{ height:100px; width:98%; padding:5px; border:1px solid #ccc; border-top:2px solid #aaa; border-left:2px solid #aaa; }
|
||||
|
||||
/* 本例子css */
|
||||
.slideGroup{ width:510px; border:1px solid #ddd; text-align:left; }
|
||||
.slideGroup .parHd{ height:30px; line-height:30px; background:#f4f4f4; padding:0 20px; border-bottom:1px solid #ddd; position:relative; }
|
||||
.slideGroup .parHd ul{ float:left; position:absolute; left:20px; top:-1px; height:32px; }
|
||||
.slideGroup .parHd ul li{ float:left; padding:0 15px; cursor:pointer; }
|
||||
.slideGroup .parHd ul li.on{ height:30px; background:#fff; border:1px solid #ddd; border-bottom:2px solid #fff; }
|
||||
.slideGroup .slideBox{ overflow:hidden; zoom:1; padding:10px 0 10px 42px; position:relative; }
|
||||
|
||||
.slideGroup .sPrev,.slideGroup .sNext{ position:absolute; left:5px; top:10px; display:block; width:30px; height:94px; border:1px solid #ddd; background:url(images/icoLeft.gif) center center no-repeat #f4f4f4; }
|
||||
.slideGroup .sNext{ left:auto; right:5px; background:url(images/icoRight.gif) center center no-repeat #f4f4f4; }
|
||||
.slideGroup .sPrev:hover,.slideGroup .sNext:hover{ border-color:#f60; }
|
||||
|
||||
.slideGroup .parBd ul{ overflow:hidden; zoom:1; }
|
||||
.slideGroup .parBd ul li{ margin:0 8px; float:left; _display:inline; overflow:hidden; text-align:center; }
|
||||
.slideGroup .parBd ul li .pic{ text-align:center; }
|
||||
.slideGroup .parBd ul li .pic img{ width:120px; height:90px; display:block; padding:2px; border:1px solid #ccc; }
|
||||
.slideGroup .parBd ul li .pic a:hover img{ border-color:#999; }
|
||||
.slideGroup .parBd ul li .title{ line-height:24px; }
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
<div class="slideGroup" style="margin:0 auto">
|
||||
<div class="parHd">
|
||||
<ul><li>教育</li><li>培训</li><li>出国</li></ul>
|
||||
</div>
|
||||
<div class="parBd">
|
||||
|
||||
<div class="slideBox">
|
||||
<a class="sPrev" href="javascript:void(0)"></a>
|
||||
<ul>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1.1</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1.2</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1.3</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1.4</a></div>
|
||||
</li>
|
||||
</ul>
|
||||
<a class="sNext" href="javascript:void(0)"></a>
|
||||
</div><!-- slideBox End -->
|
||||
|
||||
<div class="slideBox">
|
||||
<a class="sPrev" href="javascript:void(0)"></a>
|
||||
<ul>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2.1</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2.2</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2.3</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2.4</a></div>
|
||||
</li>
|
||||
</ul>
|
||||
<a class="sNext" href="javascript:void(0)"></a>
|
||||
</div><!-- slideBox End -->
|
||||
|
||||
<div class="slideBox">
|
||||
<a class="sPrev" href="javascript:void(0)"></a>
|
||||
<ul>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3.1</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3.2</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3.3</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3.4</a></div>
|
||||
</li>
|
||||
</ul>
|
||||
<a class="sNext" href="javascript:void(0)"></a>
|
||||
</div><!-- slideBox End -->
|
||||
|
||||
</div><!-- parBd End -->
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
/*
|
||||
SuperSlide组合注意:
|
||||
1、内外层mainCell、targetCell、prevCell、nextCell等对象不能相同,除非特殊应用;
|
||||
2、注意书写顺序,通常先写内层js调用,再写外层js调用
|
||||
*/
|
||||
|
||||
/* 内层图片滚动切换 */
|
||||
jQuery(".slideGroup .slideBox").slide({ mainCell:"ul",vis:3,prevCell:".sPrev",nextCell:".sNext",effect:"leftLoop"});
|
||||
|
||||
/* 外层tab切换 */
|
||||
jQuery(".slideGroup").slide({titCell:".parHd li",mainCell:".parBd"});
|
||||
|
||||
</script>
|
||||
|
||||
<div class="js">
|
||||
<p>SuperSlide组合注意:</br>
|
||||
1、内外层mainCell、targetCell、prevCell、nextCell等对象不能相同,除非特殊应用;</br>
|
||||
2、注意书写顺序,通常先写内层js调用,再写外层js调用</p>
|
||||
<textarea>本例js调用:
|
||||
/* 内层图片滚动切换 */
|
||||
jQuery(".slideGroup .slideBox").slide({ mainCell:"ul",vis:3,prevCell:".sPrev",nextCell:".sNext",effect:"leftLoop"});
|
||||
|
||||
/* 外层tab切换 */
|
||||
jQuery(".slideGroup").slide({titCell:".parHd li",mainCell:".parBd"});
|
||||
</textarea>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
|
Before Width: | Height: | Size: 6.3 KiB |
@@ -1,178 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide-同一页面使用多个效果">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide-同一页面使用多个效果</title>
|
||||
<script type="text/javascript" src="../jquery1.42.min.js"></script><script type="text/javascript" src="../jquery.SuperSlide.2.1.js"></script>
|
||||
|
||||
|
||||
</head>
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; padding:20px; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
a:hover{ color:#1974A1; }
|
||||
.js{width:90%; margin:10px auto 0 auto; }
|
||||
.js p{ padding:5px 0; font-weight:bold; overflow:hidden; }
|
||||
.js p span{ float:right; }
|
||||
.js p span a{ color:#f00; text-decoration:underline; }
|
||||
.js textarea{ height:100px; width:98%; padding:5px; border:1px solid #ccc; border-top:2px solid #aaa; border-left:2px solid #aaa; }
|
||||
|
||||
h1{ font:normal 20px/200% "Microsoft YaHei"; _font-weight:bold; padding-bottom:10px; }
|
||||
h2{ font:normal 14px/200% "Microsoft YaHei"; _font-weight:bold; padding-bottom:10px; color:#c00; }
|
||||
|
||||
/* 本例子css */
|
||||
|
||||
/* 焦点图效果 */
|
||||
.picBtnTop{ width:500px; height:214px; border:1px solid #ccc; padding:5px; position:relative; overflow:hidden; zoom:1; }
|
||||
.picBtnTop .hd{ width:98px; height:214px; position:absolute; right:5px; overflow:hidden; }
|
||||
.picBtnTop .hd ul li{ width:93px; text-align:center; padding:0 0 5px 5px; }
|
||||
.picBtnTop .hd ul li img{ width:85px; height:60px; border:4px solid #ddd; cursor:pointer; vertical-align:bottom; }
|
||||
.picBtnTop .hd ul li.on{ background:url("images/icoleft.gif") no-repeat 0 28px; }
|
||||
.picBtnTop .hd ul li.on img{ border-color:#f60; }
|
||||
.picBtnTop .bd{ width:400px; height:214px; position:relative; }
|
||||
.picBtnTop .bd li{ position:relative; zoom:1; vertical-align:middle;}
|
||||
.picBtnTop .bd li .pic{ position:relative; z-index:0; }
|
||||
.picBtnTop .bd li .pic img{ width:400px; height:214px; vertical-align:bottom; }
|
||||
.picBtnTop .bd li .bg{ width:400px; height:30px; position:absolute; left:0; bottom:0; z-index:1; background:#000; filter:alpha(opacity=60);opacity:0.6; }
|
||||
.picBtnTop .bd li .title{ width:400px; height:30px; line-height:30px; left:0; bottom:0; position:absolute; z-index:2; }
|
||||
.picBtnTop .bd li .title a{ color:#fff; padding-left:15px; }
|
||||
#demo1,#demo2{ margin-bottom:20px; }
|
||||
|
||||
/* tab选项切换效果 */
|
||||
.slideTxtBox{ width:510px; border:1px solid #ddd; text-align:left; }
|
||||
.slideTxtBox .hd{ height:30px; line-height:30px; background:#f4f4f4; padding:0 20px; border-bottom:1px solid #ddd; position:relative; }
|
||||
.slideTxtBox .hd ul{ float:left; position:absolute; left:20px; top:-1px; height:32px; }
|
||||
.slideTxtBox .hd ul li{ float:left; padding:0 15px; cursor:pointer; }
|
||||
.slideTxtBox .hd ul li.on{ height:30px; background:#fff; border:1px solid #ddd; border-bottom:2px solid #fff; }
|
||||
.slideTxtBox .bd ul{ padding:15px; zoom:1; }
|
||||
.slideTxtBox .bd li{ height:24px; line-height:24px; }
|
||||
.slideTxtBox .bd li .date{ float:right; color:#999; }
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
<h1>下面3个示例演示了如何在同一个页面使用多个SuperSlide效果</h1>
|
||||
|
||||
|
||||
<h2>下面2个示例,演示如何在同一页面使用多个相同效果</h2>
|
||||
|
||||
<!-- 同一效果多次调用,你只需要各自指定一个不重复的ID,然后根据需要设置参数即可 -->
|
||||
<!-- 不同id=demo1 相同class="picBtnTop" -->
|
||||
<div id="demo1" class="picBtnTop">
|
||||
<div class="hd">
|
||||
<ul>
|
||||
<li><img src="images/pic1.jpg" /></li>
|
||||
<li><img src="images/pic2.jpg" /></li>
|
||||
<li><img src="images/pic3.jpg" /></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul>
|
||||
<li>
|
||||
<div class="bg"></div>
|
||||
<div class="pic"><a href=""><img src="images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="">效果图1</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="bg"></div>
|
||||
<div class="pic"><a href=""><img src="images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="">效果图2</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="bg"></div>
|
||||
<div class="pic"><a href=""><img src="images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="">效果图3</a></div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
//唯一不同:jQuery("#demo1")
|
||||
jQuery("#demo1").slide({ mainCell:".bd ul",effect:"top",autoPlay:true,triggerTime:0 });</script>
|
||||
|
||||
|
||||
<!-- 不同id=demo2 相同class="picBtnTop" -->
|
||||
<div id="demo2" class="picBtnTop">
|
||||
<div class="hd">
|
||||
<ul>
|
||||
<li><img src="images/pic1.jpg" /></li>
|
||||
<li><img src="images/pic2.jpg" /></li>
|
||||
<li><img src="images/pic3.jpg" /></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul>
|
||||
<li>
|
||||
<div class="bg"></div>
|
||||
<div class="pic"><a href=""><img src="images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="">效果图1</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="bg"></div>
|
||||
<div class="pic"><a href=""><img src="images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="">效果图2</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="bg"></div>
|
||||
<div class="pic"><a href=""><img src="images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="">效果图3</a></div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
//唯一不同:jQuery("#demo2")
|
||||
jQuery("#demo2").slide({ mainCell:".bd ul",effect:"top",autoPlay:true,triggerTime:0 });</script>
|
||||
|
||||
|
||||
<h2>下面1个示例,演示如何在同一页面使用其它效果</h2>
|
||||
<div class="slideTxtBox">
|
||||
<div class="hd">
|
||||
<ul><li>教育</li><li>培训</li><li>出国</li></ul>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">中国打破了世界软件巨头规则</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">口语:会说中文就能说英语!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">农场摘菜不如在线学外语好玩</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">数理化老师竟也看学习资料?</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">学英语送ipad2,45天突破听说</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">学外语,上北外!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">那些无法理解的荒唐事</a></li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">名师教作文:3妙招巧写高分</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">耶鲁小子:教你备考SAT</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">施强:高端专业语言教学</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">数理化老师竟也看学习资料?</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">【推荐】名校英语方法曝光!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">2012高考“考点”大曝光!!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">涨价仍爆棚假日旅游冰火两重天</a></li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">澳大利亚八大名校招生说明会</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">2012世界大学排名新鲜出炉</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">新加坡留学,国际双语课程</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">高考后留学日本名校随你选</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">教育培训行业优势资源推介</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">即刻预约今年最后一场教育展</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">女友坚持警局完婚不抛弃</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript">jQuery(".slideTxtBox").slide();</script>
|
||||
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
Before Width: | Height: | Size: 7.5 KiB |
@@ -1,196 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,双重Tab(slide组合)">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - 双重Tab(slide组合)</title>
|
||||
<script type="text/javascript" src="../jquery1.42.min.js"></script><script type="text/javascript" src="../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
a:hover{ color:#1974A1; }
|
||||
.js{width:90%; margin:10px auto 0 auto; }
|
||||
.js p{ padding:5px 0; font-weight:bold; overflow:hidden; }
|
||||
.js p span{ float:right; }
|
||||
.js p span a{ color:#f00; text-decoration:underline; }
|
||||
.js textarea{ height:100px; width:98%; padding:5px; border:1px solid #ccc; border-top:2px solid #aaa; border-left:2px solid #aaa; }
|
||||
|
||||
/* 本例子css */
|
||||
.outBox{ width:450px; border:1px solid #ddd; text-align:left; }
|
||||
.outBox .hd{ height:30px; line-height:30px; background:#f4f4f4; padding:0 20px; border-bottom:1px solid #ddd; position:relative; }
|
||||
.outBox .hd ul{ float:left; position:absolute; left:20px; top:-1px; height:32px; }
|
||||
.outBox .hd ul li{ float:left; padding:0 15px; cursor:pointer; }
|
||||
.outBox .hd ul li.on{ height:30px; background:#fff; border:1px solid #ddd; border-bottom:2px solid #fff; }
|
||||
|
||||
.inBox{ padding:15px 15px 0 15px; }
|
||||
.inBox .inHd{ height:24px; line-height:24px; border-bottom:1px solid #ccc; padding:0 10px; }
|
||||
.inBox .inHd ul{ overflow:hidden; zoom:1; }
|
||||
.inBox .inHd ul li{ height:24px; width:60px; text-align:center; float:left; cursor:pointer; }
|
||||
.inBox .inHd ul li.on{ background:#ccc; color:#fff; }
|
||||
.inBox .inBd ul{ padding:15px; zoom:1; overflow:hidden; }
|
||||
.inBox .inBd li{ height:24px; line-height:24px; overflow:hidden; zoom:1; }
|
||||
.inBox .inBd li .date{ float:right; color:#999; }
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
<div class="outBox" style="margin:0 auto">
|
||||
<div class="hd">
|
||||
<ul><li>教育</li><li>培训</li><li>出国</li></ul>
|
||||
</div>
|
||||
<div class="bd">
|
||||
|
||||
<!-- inBox S -->
|
||||
<div class="inBox">
|
||||
<div class="inHd">
|
||||
<ul><li>栏目一</li><li>栏目二</li><li>栏目三</li></ul>
|
||||
</div>
|
||||
<div class="inBd">
|
||||
<ul>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">中国打破了世界软件巨头规则</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">口语:会说中文就能说英语!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">农场摘菜不如在线学外语好玩</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">数理化老师竟也看学习资料?</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">学英语送ipad2,45天突破听说</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">学外语,上北外!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">那些无法理解的荒唐事</a></li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">名师教作文:3妙招巧写高分</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">耶鲁小子:教你备考SAT</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">施强:高端专业语言教学</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">数理化老师竟也看学习资料?</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">【推荐】名校英语方法曝光!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">2012高考“考点”大曝光!!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">涨价仍爆棚假日旅游冰火两重天</a></li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">澳大利亚八大名校招生说明会</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">2012世界大学排名新鲜出炉</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">新加坡留学,国际双语课程</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">高考后留学日本名校随你选</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">教育培训行业优势资源推介</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">即刻预约今年最后一场教育展</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">女友坚持警局完婚不抛弃</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- inBox S -->
|
||||
<div class="inBox">
|
||||
<div class="inHd">
|
||||
<ul><li>栏目三</li><li>栏目四</li><li>栏目五</li></ul>
|
||||
</div>
|
||||
<div class="inBd">
|
||||
<ul>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">中国打破了世界软件巨头规则</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">口语:会说中文就能说英语!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">农场摘菜不如在线学外语好玩</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">数理化老师竟也看学习资料?</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">学英语送ipad2,45天突破听说</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">学外语,上北外!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">那些无法理解的荒唐事</a></li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">名师教作文:3妙招巧写高分</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">耶鲁小子:教你备考SAT</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">施强:高端专业语言教学</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">数理化老师竟也看学习资料?</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">【推荐】名校英语方法曝光!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">2012高考“考点”大曝光!!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">涨价仍爆棚假日旅游冰火两重天</a></li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">澳大利亚八大名校招生说明会</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">2012世界大学排名新鲜出炉</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">新加坡留学,国际双语课程</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">高考后留学日本名校随你选</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">教育培训行业优势资源推介</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">即刻预约今年最后一场教育展</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">女友坚持警局完婚不抛弃</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- inBox S -->
|
||||
<div class="inBox">
|
||||
<div class="inHd">
|
||||
<ul><li>栏目六</li><li>栏目七</li><li>栏目八</li></ul>
|
||||
</div>
|
||||
<div class="inBd">
|
||||
<ul>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">中国打破了世界软件巨头规则</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">口语:会说中文就能说英语!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">农场摘菜不如在线学外语好玩</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">数理化老师竟也看学习资料?</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">学英语送ipad2,45天突破听说</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">学外语,上北外!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">那些无法理解的荒唐事</a></li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">名师教作文:3妙招巧写高分</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">耶鲁小子:教你备考SAT</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">施强:高端专业语言教学</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">数理化老师竟也看学习资料?</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">【推荐】名校英语方法曝光!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">2012高考“考点”大曝光!!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">涨价仍爆棚假日旅游冰火两重天</a></li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">澳大利亚八大名校招生说明会</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">2012世界大学排名新鲜出炉</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">新加坡留学,国际双语课程</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">高考后留学日本名校随你选</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">教育培训行业优势资源推介</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">即刻预约今年最后一场教育展</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">女友坚持警局完婚不抛弃</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div><!-- bd E -->
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
/*
|
||||
SuperSlide组合注意:
|
||||
1、内外层mainCell、targetCell、prevCell、nextCell等对象不能相同,除非特殊应用;
|
||||
2、注意书写顺序,通常先写内层js调用,再写外层js调用
|
||||
*/
|
||||
|
||||
/* 内层inBox渐显切换,注意titCell、mainCell等不能与外层相同 */
|
||||
jQuery(".inBox").slide({ titCell:".inHd li",mainCell:".inBd" });
|
||||
/* 外层outBox左滚动切换 */
|
||||
jQuery(".outBox").slide({ effect:"left" });
|
||||
</script>
|
||||
|
||||
<div class="js">
|
||||
<p>SuperSlide组合注意:</br>
|
||||
1、内外层mainCell、targetCell、prevCell、nextCell等对象不能相同,除非特殊应用;</br>
|
||||
2、注意书写顺序,通常先写内层js调用,再写外层js调用</p>
|
||||
<textarea>
|
||||
/* 内层inBox渐显切换,注意titCell、mainCell等不能与外层相同 */
|
||||
jQuery(".inBox").slide({ titCell:".inHd li",mainCell:".inBd" });
|
||||
/* 外层outBox左滚动切换 */
|
||||
jQuery(".outBox").slide({ effect:"left" });
|
||||
</textarea>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
|
Before Width: | Height: | Size: 7.0 KiB |
@@ -1,166 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,Tab+无缝滚动(slide组合)">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - Tab+无缝滚动(slide组合)</title>
|
||||
<script type="text/javascript" src="../jquery1.42.min.js"></script><script type="text/javascript" src="../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
a:hover{ color:#1974A1; }
|
||||
.js{width:90%; margin:10px auto 0 auto; }
|
||||
.js p{ padding:5px 0; font-weight:bold; overflow:hidden; }
|
||||
.js p span{ float:right; }
|
||||
.js p span a{ color:#f00; text-decoration:underline; }
|
||||
.js textarea{ height:100px; width:98%; padding:5px; border:1px solid #ccc; border-top:2px solid #aaa; border-left:2px solid #aaa; }
|
||||
|
||||
/* 本例子css */
|
||||
.slideGroup{ width:510px; border:1px solid #ddd; text-align:left; }
|
||||
.slideGroup .parHd{ height:30px; line-height:30px; background:#f4f4f4; padding:0 20px; border-bottom:1px solid #ddd; position:relative; }
|
||||
.slideGroup .parHd ul{ float:left; position:absolute; left:20px; top:-1px; height:32px; }
|
||||
.slideGroup .parHd ul li{ float:left; padding:0 15px; cursor:pointer; }
|
||||
.slideGroup .parHd ul li.on{ height:30px; background:#fff; border:1px solid #ddd; border-bottom:2px solid #fff; }
|
||||
.slideGroup .slideBox{ overflow:hidden; zoom:1; padding:10px 0 10px 42px; position:relative; }
|
||||
|
||||
.slideGroup .sPrev,.slideGroup .sNext{ position:absolute; left:5px; top:10px; display:block; width:30px; height:94px; border:1px solid #ddd; background:url(images/icoLeft.gif) center center no-repeat #f4f4f4; }
|
||||
.slideGroup .sNext{ left:auto; right:5px; background:url(images/icoRight.gif) center center no-repeat #f4f4f4; }
|
||||
.slideGroup .sPrev:hover,.slideGroup .sNext:hover{ border-color:#f60; }
|
||||
|
||||
.slideGroup .parBd ul{ overflow:hidden; zoom:1; }
|
||||
.slideGroup .parBd ul li{ margin:0 8px; float:left; _display:inline; overflow:hidden; text-align:center; }
|
||||
.slideGroup .parBd ul li .pic{ text-align:center; }
|
||||
.slideGroup .parBd ul li .pic img{ width:120px; height:90px; display:block; padding:2px; border:1px solid #ccc; }
|
||||
.slideGroup .parBd ul li .pic a:hover img{ border-color:#999; }
|
||||
.slideGroup .parBd ul li .title{ line-height:24px; }
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
<div class="slideGroup" style="margin:0 auto">
|
||||
<div class="parHd">
|
||||
<ul><li>教育</li><li>培训</li><li>出国</li></ul>
|
||||
</div>
|
||||
<div class="parBd">
|
||||
|
||||
<div class="slideBox">
|
||||
<a class="sPrev" href="javascript:void(0)"></a>
|
||||
<ul>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1.1</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1.2</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1.3</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1.4</a></div>
|
||||
</li>
|
||||
</ul>
|
||||
<a class="sNext" href="javascript:void(0)"></a>
|
||||
</div><!-- slideBox End -->
|
||||
|
||||
<div class="slideBox">
|
||||
<a class="sPrev" href="javascript:void(0)"></a>
|
||||
<ul>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2.1</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2.2</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2.3</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2.4</a></div>
|
||||
</li>
|
||||
</ul>
|
||||
<a class="sNext" href="javascript:void(0)"></a>
|
||||
</div><!-- slideBox End -->
|
||||
|
||||
<div class="slideBox">
|
||||
<a class="sPrev" href="javascript:void(0)"></a>
|
||||
<ul>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3.1</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3.2</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3.3</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3.4</a></div>
|
||||
</li>
|
||||
</ul>
|
||||
<a class="sNext" href="javascript:void(0)"></a>
|
||||
</div><!-- slideBox End -->
|
||||
|
||||
</div><!-- parBd End -->
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
/*
|
||||
SuperSlide组合注意:
|
||||
1、内外层mainCell、targetCell、prevCell、nextCell等对象不能相同,除非特殊应用;
|
||||
2、注意书写顺序,通常先写内层js调用,再写外层js调用
|
||||
*/
|
||||
|
||||
/* 内层图片无缝滚动 */
|
||||
jQuery(".slideGroup .slideBox").slide({ mainCell:"ul",vis:3,prevCell:".sPrev",nextCell:".sNext",effect:"leftMarquee",interTime:50,autoPlay:true,trigger:"click"});
|
||||
|
||||
/* 外层tab切换 */
|
||||
jQuery(".slideGroup").slide({titCell:".parHd li",mainCell:".parBd"});
|
||||
|
||||
</script>
|
||||
|
||||
<div class="js">
|
||||
<p>SuperSlide组合注意:</br>
|
||||
1、内外层mainCell、targetCell、prevCell、nextCell等对象不能相同,除非特殊应用;</br>
|
||||
2、注意书写顺序,通常先写内层js调用,再写外层js调用</p>
|
||||
<textarea>本例js调用:
|
||||
/* 内层图片无缝滚动 */
|
||||
jQuery(".slideGroup .slideBox").slide({ mainCell:"ul",vis:3,prevCell:".sPrev",nextCell:".sNext",effect:"leftMarquee",interTime:50,autoPlay:true,trigger:"click"});
|
||||
|
||||
/* 外层tab切换 */
|
||||
jQuery(".slideGroup").slide({titCell:".parHd li",mainCell:".parBd"});
|
||||
</textarea>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
|
Before Width: | Height: | Size: 9.0 KiB |
@@ -1,79 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,图片导航焦点图">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - 图片导航焦点图</title>
|
||||
<script type="text/javascript" src="../jquery1.42.min.js"></script><script type="text/javascript" src="../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
a:hover{ color:#1974A1; }
|
||||
.js{width:90%; margin:10px auto 0 auto; }
|
||||
.js p{ padding:5px 0; font-weight:bold; overflow:hidden; }
|
||||
.js p span{ float:right; }
|
||||
.js p span a{ color:#f00; text-decoration:underline; }
|
||||
.js textarea{ height:100px; width:98%; padding:5px; border:1px solid #ccc; border-top:2px solid #aaa; border-left:2px solid #aaa; }
|
||||
|
||||
/* 本例子css */
|
||||
.picFocus{ margin:0 auto; width:467px; border:1px solid #ccc; padding:5px; position:relative; overflow:hidden; zoom:1; }
|
||||
.picFocus .hd{ width:100%; padding-top:5px; overflow:hidden; }
|
||||
.picFocus .hd ul{ margin-right:-5px; overflow:hidden; zoom:1; }
|
||||
.picFocus .hd ul li{ padding-top:5px; float:left; text-align:center; }
|
||||
.picFocus .hd ul li img{ width:109px; height:65px; border:2px solid #ddd; cursor:pointer; margin-right:5px; }
|
||||
.picFocus .hd ul li.on{ background:url("images/icoUp.gif") no-repeat center 0; }
|
||||
.picFocus .hd ul li.on img{ border-color:#f60; }
|
||||
.picFocus .bd li{ vertical-align:middle; }
|
||||
.picFocus .bd img{ width:467px; height:230px; display:block; }
|
||||
|
||||
</style>
|
||||
|
||||
<div class="picFocus">
|
||||
<div class="bd">
|
||||
<ul>
|
||||
<li><a target="_blank" href="www.SuperSlide2.com"><img src="images/pic1.jpg" /></a></li>
|
||||
<li><a target="_blank" href="www.SuperSlide2.com"><img src="images/pic2.jpg" /></a></li>
|
||||
<li><a target="_blank" href="www.SuperSlide2.com"><img src="images/pic3.jpg" /></a></li>
|
||||
<li><a target="_blank" href="www.SuperSlide2.com"><img src="images/pic4.jpg" /></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="hd">
|
||||
<ul>
|
||||
<li><img src="images/pic1.jpg" /></li>
|
||||
<li><img src="images/pic2.jpg" /></li>
|
||||
<li><img src="images/pic3.jpg" /></li>
|
||||
<li><img src="images/pic4.jpg" /></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<script type="text/javascript">jQuery(".picFocus").slide({ mainCell:".bd ul",effect:"left",autoPlay:true });</script>
|
||||
|
||||
|
||||
|
||||
<div class="js">
|
||||
<p>js调用:</p>
|
||||
<textarea>jQuery(".picFocus").slide({ mainCell:".bd ul",effect:"left",autoPlay:true });</textarea>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
|
Before Width: | Height: | Size: 11 KiB |
@@ -1,98 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,jQuery标签切换效果,Tab切换效果">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - Tab切换效果</title>
|
||||
<script type="text/javascript" src="../../jquery1.42.min.js"></script><script type="text/javascript" src="../../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
a:hover{ color:#1974A1; }
|
||||
|
||||
|
||||
/* 本例子css */
|
||||
.slideTxtBox{ width:450px; border:1px solid #ddd; text-align:left; }
|
||||
.slideTxtBox .hd{ height:30px; line-height:30px; background:#f4f4f4; padding:0 10px 0 20px; border-bottom:1px solid #ddd; position:relative; }
|
||||
.slideTxtBox .hd ul{ float:left; position:absolute; left:20px; top:-1px; height:32px; }
|
||||
.slideTxtBox .hd ul li{ float:left; padding:0 15px; cursor:pointer; }
|
||||
.slideTxtBox .hd ul li.on{ height:30px; background:#fff; border:1px solid #ddd; border-bottom:2px solid #fff; }
|
||||
.slideTxtBox .bd ul{ padding:15px; zoom:1; }
|
||||
.slideTxtBox .bd li{ height:24px; line-height:24px; }
|
||||
.slideTxtBox .bd li .date{ float:right; color:#999; }
|
||||
|
||||
/* 下面是前/后按钮代码,如果不需要删除即可 */
|
||||
.slideTxtBox .arrow{ position:absolute; right:10px; top:0; }
|
||||
.slideTxtBox .arrow a{ display:block; width:5px; height:9px; float:right; margin-right:5px; margin-top:10px; overflow:hidden;
|
||||
cursor:pointer; background:url("../images/arrow.png") 0 0 no-repeat; }
|
||||
.slideTxtBox .arrow .next{ background-position:0 -50px; }
|
||||
.slideTxtBox .arrow .prevStop{ background-position:-60px 0; }
|
||||
.slideTxtBox .arrow .nextStop{ background-position:-60px -50px; }
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
<div class="slideTxtBox">
|
||||
<div class="hd">
|
||||
|
||||
<!-- 下面是前/后按钮代码,如果不需要删除即可 -->
|
||||
<span class="arrow"><a class="next"></a><a class="prev"></a></span>
|
||||
|
||||
<ul><li>教育</li><li>培训</li><li>出国</li></ul>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">中国打破了世界软件巨头规则</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">口语:会说中文就能说英语!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">农场摘菜不如在线学外语好玩</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">数理化老师竟也看学习资料?</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">学英语送ipad2,45天突破听说</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">学外语,上北外!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">那些无法理解的荒唐事</a></li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">名师教作文:3妙招巧写高分</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">耶鲁小子:教你备考SAT</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">施强:高端专业语言教学</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">数理化老师竟也看学习资料?</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">【推荐】名校英语方法曝光!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">2012高考“考点”大曝光!!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">涨价仍爆棚假日旅游冰火两重天</a></li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">澳大利亚八大名校招生说明会</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">2012世界大学排名新鲜出炉</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">新加坡留学,国际双语课程</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">高考后留学日本名校随你选</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">教育培训行业优势资源推介</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">即刻预约今年最后一场教育展</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">女友坚持警局完婚不抛弃</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script id="jsID" type="text/javascript">
|
||||
var ary = location.href.split("&");
|
||||
jQuery(".slideTxtBox").slide( { effect:ary[1],autoPlay:ary[2],trigger:ary[3],easing:ary[4],delayTime:ary[5],pnLoop:ary[6] });
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
@@ -1,72 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,jQuery文字无缝滚动特效,javascript文字无缝滚动特效">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - 文字无缝滚动特效-上</title>
|
||||
<script type="text/javascript" src="../../jquery1.42.min.js"></script><script type="text/javascript" src="../../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
a:hover{ color:#1974A1; }
|
||||
|
||||
|
||||
/* 本例子css */
|
||||
.txtMarquee-top{ overflow:hidden; position:relative; border:1px solid #ccc; }
|
||||
.txtMarquee-top .hd{ overflow:hidden; height:30px; background:#f4f4f4; padding:0 10px; }
|
||||
.txtMarquee-top .hd .prev,.txtMarquee-top .hd .next{ display:block; width:9px; height:5px; float:right; margin-right:5px; margin-top:10px; overflow:hidden;
|
||||
cursor:pointer; background:url("../images/arrow.png") 0 -100px no-repeat;}
|
||||
.txtMarquee-top .hd .next{ background-position:0 -140px; }
|
||||
.txtMarquee-top .hd .prevStop{ background-position:-60px -100px; }
|
||||
.txtMarquee-top .hd .nextStop{ background-position:-60px -140px; }
|
||||
.txtMarquee-top .bd{ padding:15px; }
|
||||
.txtMarquee-top .infoList li{ height:24px; line-height:24px; }
|
||||
.txtMarquee-top .infoList li .date{ float:right; color:#999; }
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
<div class="txtMarquee-top">
|
||||
<div class="hd">
|
||||
<a class="next"></a>
|
||||
<a class="prev"></a>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul class="infoList">
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">中国打破了世界软件巨头规则</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">口语:会说中文就能说英语!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">农场摘菜不如在线学外语好玩</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">数理化老师竟也看学习资料?</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">学英语送ipad2,45天突破听说</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">学外语,上北外!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">那些无法理解的荒唐事</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script id="jsID" type="text/javascript">
|
||||
var ary = location.href.split("&");
|
||||
jQuery(".txtMarquee-top").slide( { mainCell:".bd ul",autoPlay:true,effect:ary[1],vis:ary[2],interTime:ary[3],opp:ary[4],pnLoop:ary[5],trigger:ary[6],mouseOverStop:ary[7] });
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
@@ -1,106 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,jQuery文字无缝滚动特效,javascript文字无缝滚动特效">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - 导航效果</title>
|
||||
<script type="text/javascript" src="../../jquery1.42.min.js"></script><script type="text/javascript" src="../../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
a:hover{ color:#1974A1; }
|
||||
|
||||
|
||||
/* 本例子css */
|
||||
.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
|
||||
.nav{ padding:0 20px; height:34px; line-height:34px; background:#39A4DC; position:relative; z-index:1; }
|
||||
.nav a{ color:#fff; }
|
||||
.nav .nLi{ float:left; position:relative; display:inline; }
|
||||
.nav .nLi h3{ float:left; }
|
||||
.nav .nLi h3 a{ display:block; padding:0 20px; font-size:14px; font-weight:bold; }
|
||||
.nav .sub{ display:none; width:100px; left:0; top:34px; position:absolute; background:#4E4E4E; line-height:26px; padding:5px 0; }
|
||||
.nav .sub li{ zoom:1; }
|
||||
.nav .sub a{ display:block; padding:0 10px; }
|
||||
.nav .sub a:hover{ background:#6d6d6d; color:#fff; }
|
||||
.nav .on h3 a{ background:#4E4E4E; color:#fff; }
|
||||
</style>
|
||||
|
||||
|
||||
<ul id="nav" class="nav clearfix">
|
||||
<li class="nLi">
|
||||
<h3><a href="http://www.SuperSlide2.com" target="_blank">首页</a></h3>
|
||||
</li>
|
||||
<li class="nLi">
|
||||
<h3><a href="http://www.SuperSlide2.com" target="_blank">新闻</a></h3>
|
||||
<ul class="sub">
|
||||
<li><a href="#">新闻首页</a></li>
|
||||
<li><a href="#">新闻人物</a></li>
|
||||
<li><a href="#">新闻电视</a></li>
|
||||
<li><a href="#">新闻图片</a></li>
|
||||
<li><a href="#">新闻视频</a></li>
|
||||
<li><a href="# ">新闻专题</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nLi">
|
||||
<h3><a href="http://www.SuperSlide2.com" target="_blank">预告片</a></h3>
|
||||
<ul class="sub">
|
||||
<li><a href="#">新闻首页</a></li>
|
||||
<li><a href="#">新闻人物</a></li>
|
||||
<li><a href="#">新闻电视</a></li>
|
||||
<li><a href="#">新闻图片</a></li>
|
||||
<li><a href="#">新闻视频</a></li>
|
||||
<li><a href="# ">新闻专题</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nLi ">
|
||||
<h3><a href="http://www.SuperSlide2.com" target="_blank">影评</a></h3>
|
||||
<ul class="sub">
|
||||
<li><a href="#">新闻首页</a></li>
|
||||
<li><a href="#">新闻人物</a></li>
|
||||
<li><a href="#">新闻电视</a></li>
|
||||
<li><a href="#">新闻图片</a></li>
|
||||
<li><a href="#">新闻视频</a></li>
|
||||
<li><a href="# ">新闻专题</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nLi">
|
||||
<h3><a href="http://www.SuperSlide2.com" target="_blank">资料库</a></h3>
|
||||
<ul class="sub">
|
||||
<li><a href="#">新闻首页</a></li>
|
||||
<li><a href="#">新闻人物</a></li>
|
||||
<li><a href="#">新闻电视</a></li>
|
||||
<li><a href="#">新闻图片</a></li>
|
||||
<li><a href="#">新闻视频</a></li>
|
||||
<li><a href="# ">新闻专题</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
|
||||
<div class="intro" style="padding:10px">
|
||||
假设当前频道为“预告片”,</br>
|
||||
手动或后台程序添加titOnClassName类名(默认是'on'),相当于设置参数defaultIndex:2。</br>
|
||||
若同时设置参数returnDefault:true,则鼠标移走后返回当前频道。
|
||||
</div>
|
||||
|
||||
<script id="jsID" type="text/javascript">
|
||||
var ary = location.href.split("&");
|
||||
jQuery("#nav").slide({ type:"menu", titCell:".nLi", targetCell:".sub",effect:ary[1], delayTime:ary[2] , triggerTime:ary[3], defaultPlay:ary[4],returnDefault:ary[5],easing:ary[6] });
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
@@ -1,77 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,targetCell基础示例">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - targetCell基础示例</title>
|
||||
<script type="text/javascript" src="../../jquery1.42.min.js"></script><script type="text/javascript" src="../../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
.js{width:90%; margin:10px auto 0 auto; }
|
||||
.js p{ padding:5px 0; font-weight:bold; overflow:hidden; }
|
||||
.js p span{ float:right; }
|
||||
.js p span a{ color:#f00; text-decoration:underline; }
|
||||
.js textarea{ height:50px; width:98%; padding:5px; border:1px solid #ccc; border-top:2px solid #aaa; border-left:2px solid #aaa; }
|
||||
|
||||
|
||||
/* 本例子css */
|
||||
.sideMenu{ border:1px solid #ddd; }
|
||||
.sideMenu h3{ height:32px; line-height:32px; padding-left:10px; border-top:1px solid #e3e3e3; background:#f4f4f4; cursor:pointer;
|
||||
font:normal 14px/32px "Microsoft YaHei";
|
||||
}
|
||||
.sideMenu h3 em{ float:right; display:block; width:40px; height:32px; background:url(../images/icoAdd.png) 16px 12px no-repeat; cursor:pointer; }
|
||||
.sideMenu h3.on em{ background-position:16px -57px; }
|
||||
.sideMenu ul{ padding:8px 25px; color:#999; display:none; /* 默认都隐藏 */ }
|
||||
|
||||
</style>
|
||||
|
||||
<div class="sideMenu" style="margin:0 auto">
|
||||
<h3><em></em>书签切换系列</h3>
|
||||
<ul>
|
||||
<li>淘宝首页右侧公告</li>
|
||||
<li>京东首页产品切换</li>
|
||||
<li>苏宁易购首页品牌切换</li>
|
||||
<li>1号店双重切换</li>
|
||||
<li>腾讯健康频道切换</li>
|
||||
</ul>
|
||||
<h3><em></em>幻灯片/焦点图系列</h3>
|
||||
<ul>
|
||||
<li>淘宝首页焦点图</li>
|
||||
<li>腾讯娱乐频道焦点图</li>
|
||||
<li>腾讯电影频道焦点图</li>
|
||||
<li>网易游戏频道焦点图</li>
|
||||
<li>易迅首页焦点图</li>
|
||||
</ul>
|
||||
<h3><em></em>带按钮切换</h3>
|
||||
<ul>
|
||||
<li>淘宝首页今日活动</li>
|
||||
<li>豆瓣读书频道</li>
|
||||
<li>天猫首页品牌切换</li>
|
||||
<li>格瓦拉首页活动进行中</li>
|
||||
<li>腾讯博客图片滚动</li>
|
||||
</ul>
|
||||
|
||||
</div><!-- sideMenu End -->
|
||||
|
||||
<script type="text/javascript">
|
||||
var ary = location.href.split("&");
|
||||
jQuery(".sideMenu").slide({ titCell:"h3", targetCell:"ul", effect:ary[1], delayTime:ary[2] , trigger:ary[3], triggerTime:ary[4], defaultPlay:ary[5], returnDefault:ary[6],easing:ary[7] });
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
@@ -1,75 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,jQuery焦点图/幻灯片">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - 焦点图/幻灯片</title>
|
||||
<script type="text/javascript" src="../../jquery1.42.min.js"></script><script type="text/javascript" src="../../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
|
||||
/* 本例子css */
|
||||
.slideBox{ width:450px; height:230px; overflow:hidden; position:relative; border:1px solid #ddd; }
|
||||
.slideBox .hd{ height:15px; overflow:hidden; position:absolute; right:5px; bottom:5px; z-index:1; }
|
||||
.slideBox .hd ul{ overflow:hidden; zoom:1; float:left; }
|
||||
.slideBox .hd ul li{ float:left; margin-right:2px; width:15px; height:15px; line-height:14px; text-align:center; background:#fff; cursor:pointer; }
|
||||
.slideBox .hd ul li.on{ background:#f00; color:#fff; }
|
||||
.slideBox .bd{ position:relative; height:100%; z-index:0; }
|
||||
.slideBox .bd li{ zoom:1; vertical-align:middle; }
|
||||
.slideBox .bd img{ width:450px; height:230px; display:block; }
|
||||
|
||||
/* 下面是前/后按钮代码,如果不需要删除即可 */
|
||||
.slideBox .prev,
|
||||
.slideBox .next{ position:absolute; left:3%; top:50%; margin-top:-25px; display:block; width:32px; height:40px; background:url(../images/slider-arrow.png) -110px 5px no-repeat; filter:alpha(opacity=50);opacity:0.5; }
|
||||
.slideBox .next{ left:auto; right:3%; background-position:8px 5px; }
|
||||
.slideBox .prev:hover,
|
||||
.slideBox .next:hover{ filter:alpha(opacity=100);opacity:1; }
|
||||
.slideBox .prevStop{ display:none; }
|
||||
.slideBox .nextStop{ display:none; }
|
||||
|
||||
</style>
|
||||
|
||||
<div id="slideBox" class="slideBox">
|
||||
<div class="hd">
|
||||
<ul><li>1</li><li>2</li><li>3</li></ul>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic1.jpg" /></a></li>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic2.jpg" /></a></li>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic3.jpg" /></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- 下面是前/后按钮代码,如果不需要删除即可 -->
|
||||
<a class="prev" href="javascript:void(0)"></a>
|
||||
<a class="next" href="javascript:void(0)"></a>
|
||||
|
||||
</div>
|
||||
|
||||
<script id="jsID" type="text/javascript">
|
||||
var ary = location.href.split("&");
|
||||
jQuery(".slideBox").slide( { mainCell:".bd ul", effect:ary[1],autoPlay:ary[2],trigger:ary[3],easing:ary[4],delayTime:ary[5],mouseOverStop:ary[6],pnLoop:ary[7] });
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
@@ -1,94 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,jQuery图片滚动特效,javascript图片滚动特效">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - 图片滚动特效-左</title>
|
||||
<script type="text/javascript" src="../../jquery1.42.min.js"></script><script type="text/javascript" src="../../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
|
||||
/* 本例子css */
|
||||
.picScroll-left{ overflow:hidden; position:relative; border:1px solid #ccc; }
|
||||
.picScroll-left .hd{ overflow:hidden; height:30px; background:#f4f4f4; padding:0 10px; }
|
||||
.picScroll-left .hd .prev,.picScroll-left .hd .next{ display:block; width:5px; height:9px; float:right; margin-right:5px; margin-top:10px; overflow:hidden;
|
||||
cursor:pointer; background:url("../images/arrow.png") 0 0 no-repeat;}
|
||||
.picScroll-left .hd .next{ background-position:0 -50px; }
|
||||
.picScroll-left .hd .prevStop{ background-position:-60px 0; }
|
||||
.picScroll-left .hd .nextStop{ background-position:-60px -50px; }
|
||||
.picScroll-left .hd ul{ float:right; overflow:hidden; zoom:1; margin-top:10px; zoom:1; }
|
||||
.picScroll-left .hd ul li{ float:left; width:9px; height:9px; overflow:hidden; margin-right:5px; text-indent:-999px; cursor:pointer; background:url("../images/icoCircle.gif") 0 -9px no-repeat; }
|
||||
.picScroll-left .hd ul li.on{ background-position:0 0; }
|
||||
.picScroll-left .bd{ padding:10px; }
|
||||
.picScroll-left .bd ul{ overflow:hidden; zoom:1; }
|
||||
.picScroll-left .bd ul li{ margin:0 8px; float:left; _display:inline; overflow:hidden; text-align:center; }
|
||||
.picScroll-left .bd ul li .pic{ text-align:center; }
|
||||
.picScroll-left .bd ul li .pic img{ width:120px; height:90px; display:block; padding:2px; border:1px solid #ccc; }
|
||||
.picScroll-left .bd ul li .pic a:hover img{ border-color:#999; }
|
||||
.picScroll-left .bd ul li .title{ line-height:24px; }
|
||||
|
||||
</style>
|
||||
|
||||
<div class="picScroll-left">
|
||||
<div class="hd">
|
||||
<a class="next"></a>
|
||||
<ul></ul>
|
||||
<a class="prev"></a>
|
||||
<span class="pageState"></span>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul class="picList">
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic4.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图4</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic5.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图5</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic6.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图6</a></div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script id="jsID" type="text/javascript">
|
||||
var ary = location.href.split("&");
|
||||
jQuery(".picScroll-left").slide( { titCell:".hd ul",mainCell:".bd ul",autoPage:true,effect:ary[1],autoPlay:ary[2],scroll:ary[3],vis:ary[4],easing:ary[5],delayTime:ary[6],pnLoop:ary[7],trigger:ary[8],mouseOverStop:ary[9] });
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
@@ -1,94 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,jQuery图片滚动特效,javascript图片滚动特效">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - 图片上滚动特效-上</title>
|
||||
<script type="text/javascript" src="../../jquery1.42.min.js"></script><script type="text/javascript" src="../../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
|
||||
/* 本例子css */
|
||||
.picScroll-top{ margin:0 auto; width:210px; overflow:hidden; position:relative; border:1px solid #ccc; }
|
||||
.picScroll-top .hd{ overflow:hidden; height:30px; background:#f4f4f4; padding:0 10px; }
|
||||
.picScroll-top .hd .prev,.picScroll-top .hd .next{ display:block; width:9px; height:5px; float:right; margin-right:5px; margin-top:10px; overflow:hidden;
|
||||
cursor:pointer; background:url("../images/arrow.png") 0 -100px no-repeat;}
|
||||
.picScroll-top .hd .next{ background-position:0 -140px; }
|
||||
.picScroll-top .hd .prevStop{ background-position:-60px -100px; }
|
||||
.picScroll-top .hd .nextStop{ background-position:-60px -140px; }
|
||||
.picScroll-top .hd ul{ float:right; overflow:hidden; zoom:1; margin-top:10px; zoom:1; }
|
||||
.picScroll-top .hd ul li{ float:left; width:9px; height:9px; overflow:hidden; margin-right:5px; text-indent:-999px; cursor:pointer; background:url("../images/icoCircle.gif") 0 -9px no-repeat; }
|
||||
.picScroll-top .hd ul li.on{ background-position:0 0; }
|
||||
.picScroll-top .bd{ padding:10px; }
|
||||
.picScroll-top .bd ul{ overflow:hidden; zoom:1; }
|
||||
.picScroll-top .bd ul li{ text-align:center; zoom:1; }
|
||||
.picScroll-top .bd ul li .pic{ text-align:center; }
|
||||
.picScroll-top .bd ul li .pic img{ width:180px; height:90px; display:block; padding:2px; border:1px solid #ccc; }
|
||||
.picScroll-top .bd ul li .pic a:hover img{ border-color:#999; }
|
||||
.picScroll-top .bd ul li .title{ line-height:24px; }
|
||||
|
||||
</style>
|
||||
|
||||
<div class="picScroll-top">
|
||||
<div class="hd">
|
||||
<a class="next"></a>
|
||||
<ul></ul>
|
||||
<a class="prev"></a>
|
||||
<span class="pageState"></span>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul class="picList">
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic4.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图4</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic5.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图5</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic6.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图6</a></div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script id="jsID" type="text/javascript">
|
||||
var ary = location.href.split("&");
|
||||
jQuery(".picScroll-top").slide( { titCell:".hd ul",mainCell:".bd ul",autoPage:true,effect:ary[1],autoPlay:ary[2],scroll:ary[3],vis:ary[4],easing:ary[5],delayTime:ary[6],pnLoop:ary[7],trigger:ary[8],mouseOverStop:ary[9] });
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
@@ -1,90 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,jQuery图片无缝滚动特效,javascript图片无缝滚动特效">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - 图片无缝滚动特效-左</title>
|
||||
<script type="text/javascript" src="../../jquery1.42.min.js"></script><script type="text/javascript" src="../../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
|
||||
/* 本例子css */
|
||||
.picMarquee-left{ overflow:hidden; position:relative; border:1px solid #ccc; }
|
||||
.picMarquee-left .hd{ overflow:hidden; height:30px; background:#f4f4f4; padding:0 10px; }
|
||||
.picMarquee-left .hd .prev,.picMarquee-left .hd .next{ display:block; width:5px; height:9px; float:right; margin-right:5px; margin-top:10px; overflow:hidden;
|
||||
cursor:pointer; background:url("../images/arrow.png") no-repeat;}
|
||||
.picMarquee-left .hd .next{ background-position:0 -50px; }
|
||||
.picMarquee-left .hd .prevStop{ background-position:-60px 0; }
|
||||
.picMarquee-left .hd .nextStop{ background-position:-60px -50px; }
|
||||
|
||||
.picMarquee-left .bd{ padding:10px; }
|
||||
.picMarquee-left .bd ul{ overflow:hidden; zoom:1; }
|
||||
.picMarquee-left .bd ul li{ margin:0 8px; float:left; _display:inline; overflow:hidden; text-align:center; }
|
||||
.picMarquee-left .bd ul li .pic{ text-align:center; }
|
||||
.picMarquee-left .bd ul li .pic img{ width:120px; height:90px; display:block; padding:2px; border:1px solid #ccc; }
|
||||
.picMarquee-left .bd ul li .pic a:hover img{ border-color:#999; }
|
||||
.picMarquee-left .bd ul li .title{ line-height:24px; }
|
||||
|
||||
</style>
|
||||
|
||||
<div class="picMarquee-left">
|
||||
<div class="hd">
|
||||
<a class="next"></a>
|
||||
<a class="prev"></a>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul class="picList">
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic4.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图4</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic5.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图5</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic6.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图6</a></div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script id="jsID" type="text/javascript">
|
||||
var ary = location.href.split("&");
|
||||
jQuery(".picMarquee-left").slide( { mainCell:".bd ul",autoPlay:true,effect:ary[1],vis:ary[2],interTime:ary[3],opp:ary[4],pnLoop:ary[5],trigger:ary[6],mouseOverStop:ary[7] });
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
@@ -1,89 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,jQuery图片无缝滚动特效,javascript图片无缝滚动特效">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - 图片无缝滚动特效-上</title>
|
||||
<script type="text/javascript" src="../../jquery1.42.min.js"></script><script type="text/javascript" src="../../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
|
||||
/* 本例子css */
|
||||
.picMarquee-top{ margin:0 auto; width:210px; overflow:hidden; position:relative; border:1px solid #ccc; }
|
||||
.picMarquee-top .hd{ overflow:hidden; height:30px; background:#f4f4f4; padding:0 10px; }
|
||||
.picMarquee-top .hd .prev,.picMarquee-top .hd .next{ display:block; width:9px; height:5px; float:right; margin-right:5px; margin-top:10px; overflow:hidden;
|
||||
cursor:pointer; background:url("../images/arrow.png") 0 -100px no-repeat;}
|
||||
.picMarquee-top .hd .next{ background-position:0 -140px; }
|
||||
.picMarquee-top .hd .prevStop{ background-position:-60px -100px; }
|
||||
.picMarquee-top .hd .nextStop{ background-position:-60px -140px; }
|
||||
.picMarquee-top .bd{ padding:10px; }
|
||||
.picMarquee-top .bd ul{ overflow:hidden; zoom:1; }
|
||||
.picMarquee-top .bd ul li{ text-align:center; zoom:1; }
|
||||
.picMarquee-top .bd ul li .pic{ text-align:center; }
|
||||
.picMarquee-top .bd ul li .pic img{ width:180px; height:90px; display:block; padding:2px; border:1px solid #ccc; }
|
||||
.picMarquee-top .bd ul li .pic a:hover img{ border-color:#999; }
|
||||
.picMarquee-top .bd ul li .title{ line-height:24px; }
|
||||
|
||||
</style>
|
||||
|
||||
<div class="picMarquee-top">
|
||||
<div class="hd">
|
||||
<a class="next"></a>
|
||||
<a class="prev"></a>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul class="picList">
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic1.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic2.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic3.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图3</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic4.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图4</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic5.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图5</a></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="pic"><a href="http://www.SuperSlide2.com" target="_blank"><img src="../images/pic6.jpg" /></a></div>
|
||||
<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图6</a></div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script id="jsID" type="text/javascript">
|
||||
var ary = location.href.split("&");
|
||||
jQuery(".picMarquee-top").slide( { mainCell:".bd ul",autoPlay:true,effect:ary[1],vis:ary[2],interTime:ary[3],opp:ary[4] ,pnLoop:ary[5],trigger:ary[6],mouseOverStop:ary[7] });
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
@@ -1,72 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,jQuery文字滚动特效,javascript文字滚动特效">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - 文字滚动特效-左</title>
|
||||
<script type="text/javascript" src="../../jquery1.42.min.js"></script><script type="text/javascript" src="../../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
a:hover{ color:#1974A1; }
|
||||
|
||||
/* 本例子css */
|
||||
.txtScroll-left{ position:relative; border:1px solid #ccc; }
|
||||
.txtScroll-left .hd{ overflow:hidden; height:30px; background:#f4f4f4; padding:0 10px; }
|
||||
.txtScroll-left .hd .prev,.txtScroll-left .hd .next{ display:block; width:5px; height:9px; float:right; margin-right:5px; margin-top:10px; overflow:hidden; cursor:pointer; background:url("../images/arrow.png") no-repeat;}
|
||||
.txtScroll-left .hd .next{ background-position:0 -50px; }
|
||||
.txtScroll-left .hd .prevStop{ background-position:-60px 0; }
|
||||
.txtScroll-left .hd .nextStop{ background-position:-60px -50px; }
|
||||
.txtScroll-left .hd ul{ float:right; overflow:hidden; zoom:1; margin-top:10px; }
|
||||
.txtScroll-left .hd ul li{ float:left; width:9px; height:9px; overflow:hidden; margin-right:5px; text-indent:-999px; cursor:pointer; background:url("../images/icoCircle.gif") 0 -9px no-repeat; }
|
||||
.txtScroll-left .hd ul li.on{ background-position:0 0; }
|
||||
.txtScroll-left .bd{ padding:10px; width:430px; overflow:hidden; }
|
||||
.txtScroll-left .bd ul{ overflow:hidden; zoom:1; }
|
||||
.txtScroll-left .bd ul li{ margin-right:20px; float:left; height:24px; line-height:24px; text-align:left; _display:inline;}
|
||||
.txtScroll-left .bd ul li span{ color:#999; }
|
||||
</style>
|
||||
|
||||
<div class="txtScroll-left">
|
||||
<div class="hd">
|
||||
<a class="next"></a>
|
||||
<ul class="num"><li>1</li><li>2</li><li>3</li></ul>
|
||||
<a class="prev"></a>
|
||||
<span class="pageState"></span>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul class="infoList">
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank">中国打破了世界软件巨头规则</a><span>[11-11]</span></li>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank">施强:高端专业语言教学</a><span>[11-11]</span></li>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank">新加坡留学,国际双语课程</a><span>[11-11]</span></li>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank">高考后留学日本名校随你选</a><span>[11-11]</span></li>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank">教育培训行业优势资源推介</a><span>[11-11]</span></li>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank">女友坚持警局完婚不抛弃</a><span>[11-11]</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script id="jsID" type="text/javascript">
|
||||
var ary = location.href.split("&");
|
||||
jQuery(".txtScroll-left").slide( { titCell:".hd ul",mainCell:".bd ul",autoPage:true,effect:ary[1],autoPlay:ary[2],scroll:ary[3],vis:ary[4],easing:ary[5],delayTime:ary[6],pnLoop:ary[7],trigger:ary[8],mouseOverStop:ary[9] });
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
@@ -1,77 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,jQuery文字滚动特效,javascript文字滚动特效">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - 文字滚动特效-上</title>
|
||||
<script type="text/javascript" src="../../jquery1.42.min.js"></script><script type="text/javascript" src="../../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
a:hover{ color:#1974A1; }
|
||||
|
||||
|
||||
/* 本例子css */
|
||||
.txtScroll-top{ overflow:hidden; position:relative; border:1px solid #ccc; }
|
||||
.txtScroll-top .hd{ overflow:hidden; height:30px; background:#f4f4f4; padding:0 10px; }
|
||||
.txtScroll-top .hd .prev,.txtScroll-top .hd .next{ display:block; width:9px; height:5px; float:right; margin-right:5px; margin-top:10px; overflow:hidden;
|
||||
cursor:pointer; background:url("../images/arrow.png") 0 -100px no-repeat;}
|
||||
.txtScroll-top .hd .next{ background-position:0 -140px; }
|
||||
.txtScroll-top .hd .prevStop{ background-position:-60px -100px; }
|
||||
.txtScroll-top .hd .nextStop{ background-position:-60px -140px; }
|
||||
.txtScroll-top .hd ul{ float:right; overflow:hidden; zoom:1; margin-top:10px; }
|
||||
.txtScroll-top .hd ul li{ float:left; width:9px; height:9px; overflow:hidden; margin-right:5px; text-indent:-999px; cursor:pointer; background:url("../images/icoCircle.gif") 0 -9px no-repeat; }
|
||||
.txtScroll-top .hd ul li.on{ background-position:0 0; }
|
||||
.txtScroll-top .bd{ padding:15px; }
|
||||
.txtScroll-top .infoList li{ height:24px; line-height:24px; }
|
||||
.txtScroll-top .infoList li .date{ float:right; color:#999; }
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
<div class="txtScroll-top">
|
||||
<div class="hd">
|
||||
<a class="next"></a>
|
||||
<ul></ul>
|
||||
<a class="prev"></a>
|
||||
<span class="pageState"></span>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul class="infoList">
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">中国打破了世界软件巨头规则</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">口语:会说中文就能说英语!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">农场摘菜不如在线学外语好玩</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">数理化老师竟也看学习资料?</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">学英语送ipad2,45天突破听说</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">学外语,上北外!</a></li>
|
||||
<li><span class="date">2011-11-11</span><a href="http://www.SuperSlide2.com" target="_blank">那些无法理解的荒唐事</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script id="jsID" type="text/javascript">
|
||||
var ary = location.href.split("&");
|
||||
jQuery(".txtScroll-top").slide( { titCell:".hd ul",mainCell:".bd ul",autoPage:true,effect:ary[1],autoPlay:ary[2],scroll:ary[3],vis:ary[4],easing:ary[5],delayTime:ary[6],pnLoop:ary[7],trigger:ary[8],mouseOverStop:ary[9] });
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
@@ -1,71 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Content-Language" content="zh-CN">
|
||||
<meta name="Keywords" content="SuperSlide,jQuery文字无缝滚动特效,javascript文字无缝滚动特效">
|
||||
<meta name="Description" content="SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。网站上常用的“焦点图/幻灯片”、“Tab标签切换”、“图片滚动”、“无缝滚动”等等只需要一个SuperSlide即可解决!还可以多个SuperSlide组合创造更多效果">
|
||||
<title>SuperSlide - 文字无缝滚动特效-左</title>
|
||||
<script type="text/javascript" src="../../jquery1.42.min.js"></script><script type="text/javascript" src="../../jquery.SuperSlide.2.1.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* css 重置 */
|
||||
*{margin:0; padding:0; list-style:none; }
|
||||
body{ background:#fff; font:normal 12px/22px 宋体; }
|
||||
img{ border:0; }
|
||||
a{ text-decoration:none; color:#333; }
|
||||
a:hover{ color:#1974A1; }
|
||||
|
||||
/* 本例子css */
|
||||
.txtMarquee-left{ position:relative; border:1px solid #ccc; }
|
||||
.txtMarquee-left .hd{ overflow:hidden; height:30px; background:#f4f4f4; padding:0 10px; }
|
||||
.txtMarquee-left .hd .prev,.txtMarquee-left .hd .next{ display:block; width:5px; height:9px; float:right; margin-right:5px; margin-top:10px; overflow:hidden; cursor:pointer; cursor:pointer; background:url("../images/arrow.png") no-repeat;}
|
||||
.txtMarquee-left .hd .next{ background-position:0 -50px; }
|
||||
.txtMarquee-left .hd .prevStop{ background-position:-60px 0; }
|
||||
.txtMarquee-left .hd .nextStop{ background-position:-60px -50px; }
|
||||
.txtMarquee-left .bd{ padding:10px; }
|
||||
.txtMarquee-left .bd .tempWrap{ width:425px !important; }/* 用 !important覆盖SuperSlide自动生成的宽度,这样就可以手动控制可视宽度。 */
|
||||
.txtMarquee-left .bd ul{ overflow:hidden; zoom:1; }
|
||||
.txtMarquee-left .bd ul li{ margin-right:20px; float:left; height:24px; line-height:24px; text-align:left; _display:inline; width:auto !important; }/* 用 width:auto !important 覆盖SuperSlide自动生成的宽度,解决文字不衔接问题 */
|
||||
|
||||
|
||||
.txtMarquee-left .bd ul li span{ color:#999; }
|
||||
</style>
|
||||
|
||||
<div class="txtMarquee-left">
|
||||
<div class="hd">
|
||||
<a class="next"></a>
|
||||
<a class="prev"></a>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul class="infoList">
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank">中国打破了世界软件巨头规则</a><span>[11-11]</span></li>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank">施强:高端专业语言教学</a><span>[11-11]</span></li>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank">新加坡留学,国际双语课程</a><span>[11-11]</span></li>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank">高考后留学日本名校随你选</a><span>[11-11]</span></li>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank">教育培训行业优势资源推介</a><span>[11-11]</span></li>
|
||||
<li><a href="http://www.SuperSlide2.com" target="_blank">女友坚持警局完婚不抛弃</a><span>[11-11]</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script id="jsID" type="text/javascript">
|
||||
var ary = location.href.split("&");
|
||||
jQuery(".txtMarquee-left").slide( { mainCell:".bd ul",autoPlay:true,effect:ary[1],vis:ary[2],interTime:ary[3],opp:ary[4],pnLoop:ary[5],trigger:ary[6],mouseOverStop:ary[7] });
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<script type="text/javascript">
|
||||
//百度统计代码
|
||||
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
||||
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fa630f96b6a9dd549675d26373853f7f1' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
|
||||
|
Before Width: | Height: | Size: 325 B |
|
Before Width: | Height: | Size: 137 B |
|
Before Width: | Height: | Size: 176 B |
|
Before Width: | Height: | Size: 198 B |
|
Before Width: | Height: | Size: 51 B |
|
Before Width: | Height: | Size: 53 B |
|
Before Width: | Height: | Size: 53 B |
|
Before Width: | Height: | Size: 52 B |
|
Before Width: | Height: | Size: 22 KiB |
|
Before Width: | Height: | Size: 30 KiB |
|
Before Width: | Height: | Size: 43 KiB |
|
Before Width: | Height: | Size: 65 KiB |
|
Before Width: | Height: | Size: 62 KiB |
|
Before Width: | Height: | Size: 50 KiB |
|
Before Width: | Height: | Size: 66 KiB |
|
Before Width: | Height: | Size: 46 KiB |
|
Before Width: | Height: | Size: 1.1 KiB |
|
Before Width: | Height: | Size: 325 B |
|
Before Width: | Height: | Size: 37 KiB |
|
Before Width: | Height: | Size: 488 B |
|
Before Width: | Height: | Size: 137 B |
|
Before Width: | Height: | Size: 396 B |
|
Before Width: | Height: | Size: 11 KiB |
|
Before Width: | Height: | Size: 176 B |
|
Before Width: | Height: | Size: 51 B |
|
Before Width: | Height: | Size: 53 B |