jack / photo_show · Commits

Go to a project

Authored by mlge
Commit de772ed48b8e244f6238d65d31192505f95ddc66 1 parent 8a7efe39

增加一个新页面--加载单张图片的

Inline Side-by-side
Showing 4 changed files with 1035 additions and 235 deletions
... ... @@ -129,4 +129,9 @@ public class ShowCtrl {
}
return "";
}
@RequestMapping("/loadSingleImage")
public ModelAndView loadSingleImage(){
return new ModelAndView("loadSingleImage");
}
}
... ...
... ... @@ -143,122 +143,15 @@
样本展示 </a>
</li>
<li>
<a href="loadSingleImage">
<li >
<a href="layout_horizontal_menu2.html">
Horzontal Menu 2 </a>
</li>
<li class="active">
<a href="layout_promo.html">
Promo Page
</a>
</li>
<li >
<a href="layout_blank_page.html">
Blank Page </a>
</li>
<li >
<a href="layout_email.html">
Email Templates </a>
</li>
<li >
<a href="layout_ajax.html">
Content Loading via Ajax</a>
</li>
<li >
<a href="layout_sidebar_closed.html">
Sidebar Closed Page </a>
</li>
<li >
<a href="layout_blank_page.html">
Blank Page </a>
</li>
<li >
<a href="layout_boxed_page.html">Boxed Page</a>
</li>
<li >
<a href="layout_boxed_not_responsive.html">
Non-Responsive Boxed Layout </a>
单张图片展示 </a>
</li>
<li class="dropdown-submenu">
<a tabindex="-1" href="javascript:;">
More options
<span class="arrow"></span>
</a>
<ul class="dropdown-menu">
<li><a tabindex="-1" href="#">Second level link</a></li>
<li class="dropdown-submenu">
<a tabindex="-1" href="javascript:;">More options<span class="arrow"></span></a>
<ul class="dropdown-menu">
<li><a tabindex="-1" href="index.html">Third level link</a></li>
<li><a tabindex="-1" href="index.html">Third level link</a></li>
<li><a tabindex="-1" href="index.html">Third level link</a></li>
<li><a tabindex="-1" href="index.html">Third level link</a></li>
<li><a tabindex="-1" href="index.html">Third level link</a></li>
</ul>
</li>
<li><a tabindex="-1" href="index.html">Second level link</a></li>
<li><a tabindex="-1" href="index.html">Second level link</a></li>
<li><a tabindex="-1" href="index.html">Second level link</a></li>
</ul>
</li>
</ul>
... ... @@ -846,25 +739,18 @@
<li>
<a href="/show/index">
相似图片展示 </a>
</li>
<li >
<a href="/show/toSampleShow">
样本展示 </a>
</li>
<li >
<a href="layout_horizontal_menu2.html">
Horzontal Menu 2 </a>
</li>
... ...
<!DOCTYPE html>
<!--[if IE 8]> <html lang="en" class="ie8"> <![endif]-->
<!--[if IE 9]> <html lang="en" class="ie9"> <![endif]-->
<!--[if !IE]><!--> <html lang="en"> <!--<![endif]-->
<!-- BEGIN HEAD -->
<head>
<meta charset="utf-8" />
<title>Metronic | Layouts - Promo Page</title>
<meta content="width=device-width, initial-scale=1.0" name="viewport" />
<meta content="" name="description" />
<meta content="" name="author" />
<!-- BEGIN GLOBAL MANDATORY STYLES -->
<link href="/media/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
<link href="/media/css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css"/>
<link href="/media/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
<link href="/media/css/style-metro.css" rel="stylesheet" type="text/css"/>
<link href="/media/css/style.css" rel="stylesheet" type="text/css"/>
<link href="/media/css/style-responsive.css" rel="stylesheet" type="text/css"/>
<link href="/media/css/default.css" rel="stylesheet" type="text/css" id="style_color"/>
<link href="/media/css/uniform.default.css" rel="stylesheet" type="text/css"/>
<!-- END GLOBAL MANDATORY STYLES -->
<link href="/media/css/promo.css" rel="stylesheet" type="text/css"/>
<link href="/media/css/animate.css" rel="stylesheet" type="text/css"/>
<link href="/media/css/jquery.dataTables_themeroller.css" rel="stylesheet" type="text/css" media="screen"/>
<link href="/media/css/jquery.dataTables.css" rel="stylesheet" type="text/css" media="screen"/>
<link rel="shortcut icon" href="/media/image/favicon.ico" />
</head>
<!-- END HEAD -->
<!-- BEGIN BODY -->
<body class="page-header-fixed page-full-width">
<!-- BEGIN HEADER -->
<div class="header navbar navbar-inverse navbar-fixed-top">
<!-- BEGIN TOP NAVIGATION BAR -->
<div class="navbar-inner">
<div class="container">
<!-- BEGIN LOGO -->
<a class="brand" href="index.html">
<img src="/media/image/logo.png" alt="logo" />
</a>
<!-- END LOGO -->
<!-- BEGIN HORIZANTAL MENU -->
<div class="navbar hor-menu hidden-phone hidden-tablet">
<div class="navbar-inner">
<ul class="nav">
<li class="visible-phone visible-tablet">
<!-- BEGIN RESPONSIVE QUICK SEARCH FORM -->
<form class="sidebar-search">
<div class="input-box">
<a href="javascript:;" class="remove"></a>
<input type="text" placeholder="Search..." />
<input type="button" class="submit" value=" " />
</div>
</form>
<!-- END RESPONSIVE QUICK SEARCH FORM -->
</li>
<li>
<a href="index.html">
Dashboard
</a>
</li>
<li class="active">
<a data-toggle="dropdown" class="dropdown-toggle" href="javascript:;">
<span class="selected"></span>
Layouts
<span class="arrow"></span>
</a>
<ul class="dropdown-menu">
<li>
<a href="index">
相似图片展示 </a>
</li>
<li >
<a href="toSampleShow">
样本展示 </a>
</li>
<li class="active">
<a href="loadSingleImage">
单张图片展示 </a>
</li>
</ul>
<b class="caret-out"></b>
</li>
<li>
<a href="">Tables</a>
</li>
<li>
<a data-toggle="dropdown" class="dropdown-toggle" href="">Extra
<span class="arrow"></span>
</a>
<ul class="dropdown-menu">
<li><a href="index.html">About Us</a></li>
<li><a href="index.html">Services</a></li>
<li><a href="index.html">Pricing</a></li>
<li><a href="index.html">FAQs</a></li>
<li><a href="index.html">Gallery</a></li>
<li><a href="index.html">Registration</a></li>
<li><a href="index.html">2 Columns (Left)</a></li>
<li><a href="index.html">2 Columns (Right)</a></li>
</ul>
<b class="caret-out"></b>
</li>
<li>
<span class="hor-menu-search-form-toggler">&nbsp;</span>
<div class="search-form hidden-phone hidden-tablet">
<form class="form-search">
<div class="input-append">
<input type="text" placeholder="Search..." class="m-wrap">
<button type="button" class="btn"></button>
</div>
</form>
</div>
</li>
</ul>
</div>
</div>
<!-- END HORIZANTAL MENU -->
<!-- BEGIN RESPONSIVE MENU TOGGLER -->
<a href="javascript:;" class="btn-navbar collapsed" data-toggle="collapse" data-target=".nav-collapse">
<img src="/media/image/menu-toggler.png" alt="" />
</a>
<!-- END RESPONSIVE MENU TOGGLER -->
<!-- BEGIN TOP NAVIGATION MENU -->
<ul class="nav pull-right">
<!-- BEGIN NOTIFICATION DROPDOWN -->
<li class="dropdown" id="header_notification_bar">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<i class="icon-warning-sign"></i>
<span class="badge">6</span>
</a>
<ul class="dropdown-menu extended notification">
<li>
<p>You have 14 new notifications</p>
</li>
<li>
<a href="#">
<span class="label label-success"><i class="icon-plus"></i></span>
New user registered.
<span class="time">Just now</span>
</a>
</li>
<li>
<a href="#">
<span class="label label-important"><i class="icon-bolt"></i></span>
Server #12 overloaded.
<span class="time">15 mins</span>
</a>
</li>
<li>
<a href="#">
<span class="label label-warning"><i class="icon-bell"></i></span>
Server #2 not respoding.
<span class="time">22 mins</span>
</a>
</li>
<li>
<a href="#">
<span class="label label-info"><i class="icon-bullhorn"></i></span>
Application error.
<span class="time">40 mins</span>
</a>
</li>
<li>
<a href="#">
<span class="label label-important"><i class="icon-bolt"></i></span>
Database overloaded 68%.
<span class="time">2 hrs</span>
</a>
</li>
<li>
<a href="#">
<span class="label label-important"><i class="icon-bolt"></i></span>
2 user IP blocked.
<span class="time">5 hrs</span>
</a>
</li>
<li class="external">
<a href="#">See all notifications <i class="m-icon-swapright"></i></a>
</li>
</ul>
</li>
<!-- END NOTIFICATION DROPDOWN -->
<!-- BEGIN INBOX DROPDOWN -->
<li class="dropdown" id="header_inbox_bar">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<i class="icon-envelope"></i>
<span class="badge">5</span>
</a>
<ul class="dropdown-menu extended inbox">
<li>
<p>You have 12 new messages</p>
</li>
<li>
<a href="inbox.html?a=view">
<span class="photo"><img src="/media/image/avatar2.jpg" alt="" /></span>
<span class="subject">
<span class="from">Lisa Wong</span>
<span class="time">Just Now</span>
</span>
<span class="message">
Vivamus sed auctor nibh congue nibh. auctor nibh
auctor nibh...
</span>
</a>
</li>
<li>
<a href="inbox.html?a=view">
<span class="photo"><img src="/media/image/avatar3.jpg" alt="" /></span>
<span class="subject">
<span class="from">Richard Doe</span>
<span class="time">16 mins</span>
</span>
<span class="message">
Vivamus sed congue nibh auctor nibh congue nibh. auctor nibh
auctor nibh...
</span>
</a>
</li>
<li>
<a href="inbox.html?a=view">
<span class="photo"><img src="/media/image/avatar1.jpg" alt="" /></span>
<span class="subject">
<span class="from">Bob Nilson</span>
<span class="time">2 hrs</span>
</span>
<span class="message">
Vivamus sed nibh auctor nibh congue nibh. auctor nibh
auctor nibh...
</span>
</a>
</li>
<li class="external">
<a href="inbox.html">See all messages <i class="m-icon-swapright"></i></a>
</li>
</ul>
</li>
<!-- END INBOX DROPDOWN -->
<!-- BEGIN TODO DROPDOWN -->
<li class="dropdown" id="header_task_bar">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<i class="icon-tasks"></i>
<span class="badge">5</span>
</a>
<ul class="dropdown-menu extended tasks">
<li>
<p>You have 12 pending tasks</p>
</li>
<li>
<a href="#">
<span class="task">
<span class="desc">New release v1.2</span>
<span class="percent">30%</span>
</span>
<span class="progress progress-success ">
<span style="width: 30%;" class="bar"></span>
</span>
</a>
</li>
<li>
<a href="#">
<span class="task">
<span class="desc">Application deployment</span>
<span class="percent">65%</span>
</span>
<span class="progress progress-danger progress-striped active">
<span style="width: 65%;" class="bar"></span>
</span>
</a>
</li>
<li>
<a href="#">
<span class="task">
<span class="desc">Mobile app release</span>
<span class="percent">98%</span>
</span>
<span class="progress progress-success">
<span style="width: 98%;" class="bar"></span>
</span>
</a>
</li>
<li>
<a href="#">
<span class="task">
<span class="desc">Database migration</span>
<span class="percent">10%</span>
</span>
<span class="progress progress-warning progress-striped">
<span style="width: 10%;" class="bar"></span>
</span>
</a>
</li>
<li>
<a href="#">
<span class="task">
<span class="desc">Web server upgrade</span>
<span class="percent">58%</span>
</span>
<span class="progress progress-info">
<span style="width: 58%;" class="bar"></span>
</span>
</a>
</li>
<li>
<a href="#">
<span class="task">
<span class="desc">Mobile development</span>
<span class="percent">85%</span>
</span>
<span class="progress progress-success">
<span style="width: 85%;" class="bar"></span>
</span>
</a>
</li>
<li class="external">
<a href="#">See all tasks <i class="m-icon-swapright"></i></a>
</li>
</ul>
</li>
<!-- END TODO DROPDOWN -->
<!-- BEGIN USER LOGIN DROPDOWN -->
<li class="dropdown user">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<img alt="" src="/media/image/avatar1_small.jpg" />
<span class="username">Bob Nilson</span>
<i class="icon-angle-down"></i>
</a>
<ul class="dropdown-menu">
<li><a href="extra_profile.html"><i class="icon-user"></i> My Profile</a></li>
<li><a href="page_calendar.html"><i class="icon-calendar"></i> My Calendar</a></li>
<li><a href="inbox.html"><i class="icon-envelope"></i> My Inbox(3)</a></li>
<li><a href="#"><i class="icon-tasks"></i> My Tasks</a></li>
<li class="divider"></li>
<li><a href="extra_lock.html"><i class="icon-lock"></i> Lock Screen</a></li>
<li><a href="login.html"><i class="icon-key"></i> Log Out</a></li>
</ul>
</li>
<!-- END USER LOGIN DROPDOWN -->
</ul>
<!-- END TOP NAVIGATION MENU -->
</div>
</div>
<!-- END TOP NAVIGATION BAR -->
</div>
<!-- END HEADER -->
<!-- BEGIN CONTAINER -->
<div class="page-container row-fluid">
<!-- BEGIN EMPTY PAGE SIDEBAR -->
<div class="page-sidebar nav-collapse collapse visible-phone visible-tablet">
<ul class="page-sidebar-menu">
<li class="visible-phone visible-tablet">
<!-- BEGIN RESPONSIVE QUICK SEARCH FORM -->
<form class="sidebar-search">
<div class="input-box">
<a href="javascript:;" class="remove"></a>
<input type="text" placeholder="Search..." />
<input type="button" class="submit" value=" " />
</div>
</form>
<!-- END RESPONSIVE QUICK SEARCH FORM -->
</li>
<li>
<a class="active" href="index.html">
Dashboard
</a>
</li>
<li class="active">
<a href="javascript:;">
Layouts
<span class="arrow open"></span>
<span class="selected"></span>
</a>
<ul class="sub-menu">
<li>
</li>
<li >
</li>
<li >
</li>
<li >
<a href="layout_promo.html">
Promo Page
</a>
</li>
<li >
<a href="layout_email.html">
Email Templates </a>
</li>
<li >
<a href="layout_ajax.html">
Content Loading via Ajax</a>
</li>
<li >
<a href="layout_sidebar_closed.html">
Sidebar Closed Page </a>
</li>
<li >
<a href="layout_blank_page.html">
Blank Page </a>
</li>
<li >
<a href="layout_boxed_page.html">Boxed Page</a>
</li>
<li >
<a href="layout_boxed_not_responsive.html">
Non-Responsive Boxed Layout </a>
</li>
<li >
<a href="layout_blank_page.html">
Blank Page </a>
</li>
<li>
<a href="javascript:;">
More options
<span class="arrow"></span>
</a>
<ul class="sub-menu">
<li><a href="#">Second level link</a></li>
<li>
<a href="javascript:;">More options<span class="arrow"></span></a>
<ul class="sub-menu">
<li><a href="index.html">Third level link</a></li>
<li><a href="index.html">Third level link</a></li>
<li><a href="index.html">Third level link</a></li>
<li><a href="index.html">Third level link</a></li>
<li><a href="index.html">Third level link</a></li>
</ul>
</li>
<li><a href="index.html">Second level link</a></li>
<li><a href="index.html">Second level link</a></li>
<li><a href="index.html">Second level link</a></li>
</ul>
</li>
</ul>
</li>
<li>
<a href="">Tables</a>
</li>
<li>
<a href="">Extra
<span class="arrow"></span>
</a>
<ul class="sub-menu">
<li><a href="index.html">About Us</a></li>
<li><a href="index.html">Services</a></li>
<li><a href="index.html">Pricing</a></li>
<li><a href="index.html">FAQs</a></li>
<li><a href="index.html">Gallery</a></li>
<li><a href="index.html">Registration</a></li>
<li><a href="index.html">2 Columns (Left)</a></li>
<li><a href="index.html">2 Columns (Right)</a></li>
</ul>
</li>
</ul>
</div>
<!-- END EMPTY PAGE SIDEBAR -->
<!-- BEGIN PAGE -->
<div class="page-content no-min-height">
<!-- BEGIN SAMPLE PORTLET CONFIGURATION MODAL FORM-->
<div id="portlet-config" class="modal hide">
<div class="modal-header">
<button data-dismiss="modal" class="close" type="button"></button>
<h3>portlet Settings</h3>
</div>
<div class="modal-body">
<p>Here will be a configuration form</p>
</div>
</div>
<!-- END SAMPLE PORTLET CONFIGURATION MODAL FORM-->
<!-- BEGIN PAGE CONTAINER-->
<div class="container-fluid promo-page">
<div class="row-fluid">
<div class="span12" style=" margin-top: 30px;margin-bottom: 20px;margin-left: 20px;">
<div class="form-inline" style="min-height: 40px;" >
<div class="form-group">
<input id="imagePath" name="imagePath" type="text" placeholder="image路径" class="span4"/>
<button id="imageLoad" type="button" class="btn blue" onclick="imageLoad()">imageLoad</button>
</div>
</div>
</div>
</div>
<div class="row-fluid" >
<div class="span12">
<div style="margin-left:20%;height: 500px;width: 500px;align-content: center">
<img src="" id="imgId">
</div>
</div>
</div>
<!-- BEGIN PAGE CONTENT-->
</div>
<!-- END PAGE CONTENT-->
</div>
<!-- END PAGE CONTAINER-->
</div>
<script src="/media/js/jquery-1.10.1.min.js" type="text/javascript"></script>
<script src="/media/js/jquery-migrate-1.2.1.min.js" type="text/javascript"></script>
<script src="/media/js/jquery-ui-1.10.1.custom.min.js" type="text/javascript"></script>
<script src="/media/js/bootstrap.min.js" type="text/javascript"></script>
<script src="/media/js/jquery.slimscroll.min.js" type="text/javascript"></script>
<script src="/media/js/jquery.blockui.min.js" type="text/javascript"></script>
<script src="/media/js/jquery.cookie.min.js" type="text/javascript"></script>
<script src="/media/js/jquery.uniform.min.js" type="text/javascript" ></script>
<script src="/media/js/app.js"></script>
<script src="/media/js/jquery.dataTables.js"></script>
<script>
jQuery(document).ready(function() {
App.init();
jQuery('#promo_carousel').carousel({
interval: 10000,
pause: 'hover'
});
});
//加载图片
function imageLoad(){
var getImageUrl = "/show/readAli?file="+$("#imagePath").val();
$("#imgId").attr('src',encodeURI(getImageUrl));
}
</script>
</body>
<!-- END BODY -->
</html>
\ No newline at end of file
... ...
... ... @@ -130,7 +130,7 @@
<ul class="dropdown-menu">
<li>
<li >
<a href="index">
... ... @@ -138,9 +138,9 @@
</li>
<li >
<li class="active" >
<a href="toSampleShow">
<a href="toSampleShow" >
样本展示 </a>
... ... @@ -148,119 +148,13 @@
<li >
<a href="layout_horizontal_menu2.html">
Horzontal Menu 2 </a>
</li>
<li class="active">
<a href="layout_promo.html">
Promo Page
</a>
</li>
<li >
<a href="layout_blank_page.html">
Blank Page </a>
</li>
<li >
<a href="layout_email.html">
Email Templates </a>
</li>
<li >
<a href="layout_ajax.html">
Content Loading via Ajax</a>
</li>
<li >
<a href="layout_sidebar_closed.html">
<a href="loadSingleImage">
Sidebar Closed Page </a>
单张图片展示 </a>
</li>
<li >
<a href="layout_blank_page.html">
Blank Page </a>
</li>
<li >
<a href="layout_boxed_page.html">Boxed Page</a>
</li>
<li >
<a href="layout_boxed_not_responsive.html">
Non-Responsive Boxed Layout </a>
</li>
<li class="dropdown-submenu">
<a tabindex="-1" href="javascript:;">
More options
<span class="arrow"></span>
</a>
<ul class="dropdown-menu">
<li><a tabindex="-1" href="#">Second level link</a></li>
<li class="dropdown-submenu">
<a tabindex="-1" href="javascript:;">More options<span class="arrow"></span></a>
<ul class="dropdown-menu">
<li><a tabindex="-1" href="index.html">Third level link</a></li>
<li><a tabindex="-1" href="index.html">Third level link</a></li>
<li><a tabindex="-1" href="index.html">Third level link</a></li>
<li><a tabindex="-1" href="index.html">Third level link</a></li>
<li><a tabindex="-1" href="index.html">Third level link</a></li>
</ul>
</li>
<li><a tabindex="-1" href="index.html">Second level link</a></li>
<li><a tabindex="-1" href="index.html">Second level link</a></li>
<li><a tabindex="-1" href="index.html">Second level link</a></li>
</ul>
</li>
</ul>
... ... @@ -848,25 +742,18 @@
<li>
<a href="/show/index">
相似图片展示 </a>
</li>
<li >
<a href="/show/samplesShow">
样本展示 </a>
</li>
<li >
<a href="layout_horizontal_menu2.html">
Horzontal Menu 2 </a>
</li>
... ...