图集

app/Http/Controllers/CategoryController.php

@@ -2,9 +2,7 @@
 
 namespace App\Http\Controllers;
 
-use App\Models\Advert;
 use App\Models\Category;
-use Carbon\Carbon;
 
 class CategoryController extends Controller
 {
@@ -33,6 +31,10 @@ class CategoryController extends Controller
                 if ($category->type == Category::TYPE_ADVERT) {
                     $template = 'images';
                 }
+
+                if ($category->type == Category::TYPE_PHOTO) {
+                    $template = 'photos';
+                }
             }
 
 

app/Models/Category.php

@@ -18,11 +18,13 @@ class Category extends Model
     public const TYPE_ARTICLE = 'article';
     public const TYPE_ADVERT  = 'advert';
     public const TYPE_VIDEO   = 'video';
+    public const TYPE_PHOTO   = 'photo';
     public const TYPE_LINK    = 'link';
     public const TYPES        = [
         self::TYPE_ARTICLE => '文章列表',
         self::TYPE_SHOW    => '文章详情',
         self::TYPE_ADVERT  => '图片列表',
+        self::TYPE_PHOTO   => '图集',
         self::TYPE_VIDEO   => '视频列表',
         self::TYPE_LINK    => '跳转链接',
     ];
@@ -41,6 +43,7 @@ class Category extends Model
 
     /**
      * Notes: description
+     *
      * @Author: 玄尘
      * @Date  : 2021/10/14 11:53
      * @return \Illuminate\Database\Eloquent\Relations\BelongsTo|\Illuminate\Database\Eloquent\Relations\HasMany|null
@@ -57,6 +60,7 @@ class Category extends Model
                 return $this->hasMany(Article::class);
                 break;
             case self::TYPE_ADVERT:
+            case self::TYPE_PHOTO:
                 return $this->hasMany(Advert::class);
                 break;
             case self::TYPE_VIDEO:
@@ -84,6 +88,7 @@ class Category extends Model
 
     /**
      * Notes: 获取当前分类及子分类ID
+     *
      * @Author: <C.Jason>
      * @Date  : 2020/4/6 3:12 下午
      * @return array
@@ -113,6 +118,7 @@ class Category extends Model
 
     /**
      * Notes: 格式化description
+     *
      * @Author: 玄尘
      * @Date  : 2021/10/8 15:24
      */

public/assets/index/picture/css/elements.css

@@ -0,0 +1,190 @@
+/* = Show All Pages
+-------------------------------------------------------------- */
+
+#fb7 #fb7-all-pages .fb7-container-pages {
+	position: absolute; 
+	width: 100%;
+	height: 225px;
+	background: black;
+	padding: 2% 0;
+			box-shadow: 0 0 40px #64c8d3;
+			box-shadow: 0 0 40px rgba(100, 200, 211, .8);
+	   -moz-box-shadow: 0 0 40px rgba(100, 200, 211, .8);
+	-webkit-box-shadow: 0 0 40px rgba(100, 200, 211, .8);
+}
+
+	#fb7 #fb7-menu-holder {
+		position: absolute;
+		height:inherit;
+		overflow: hidden;
+		width: 100%;
+	}
+
+		#fb7 #fb7-slider {
+			position: absolute;
+			left:0;
+			list-style: none;
+			height:inherit;
+			margin: 0;
+			padding: 0;
+		}
+
+			#fb7 #fb7-slider li {
+				float: left;
+				position: relative;
+				height:inherit;
+				padding: 0 10px;
+				text-align: center;
+				cursor: pointer;
+				margin:0;
+				list-style:none;
+			}
+
+			#fb7 #fb7-slider li:first-child {
+				padding-left: 100px;
+			}
+
+			#fb7 #fb7-slider li:last-child { 
+				padding-right: 100px;
+			}
+			
+			#fb7 #fb7-slider li:hover {
+				
+			}
+			
+			#fb7 #fb7-slider li img {
+				float: left;
+				height:inherit;
+			}
+
+
+
+/* = Contact Form
+-------------------------------------------------------------- */
+
+#fb7 #fb7-contact form {
+	position: absolute; left: 50%; top: 50%;
+	background: #161616;
+	width: 300px; 
+	height:auto;
+	margin: -115px 0 0 -165px;
+	padding: 10px 15px 15px 15px;
+		    box-shadow: 0 0 60px #64c8d3;
+		    box-shadow: 0 0 60px rgba(100, 200, 211, .7);
+	   -moz-box-shadow: 0 0 60px rgba(100, 200, 211, .7);
+	-webkit-box-shadow: 0 0 60px rgba(100, 200, 211, .7);
+}
+
+#fb7 #fb7-contact form,
+#fb7 #fb7-contact input,
+#fb7 #fb7-contact textarea {
+	        border-radius: 8px;
+	   -moz-border-radius: 8px;
+	-webkit-border-radius: 8px;
+	
+}
+
+	#fb7 #fb7-contact form h3 {
+		font-family:Arial,sans-serif;
+		margin: 0 0 6px 0;
+		font-size: 0.875em;
+		font-weight: bold;
+		/*text-transform: uppercase;/*/
+		color: white;
+		-webkit-font-smoothing: antialiased;
+	}
+
+	#fb7 #fb7-contact form p {
+		padding: 0 0 3px 0;
+		font-size: .75em;
+		margin:0;
+	}
+	
+	#fb7 #fb7-contact form input,
+	#fb7 #fb7-contact form textarea {
+		font-family:Arial, Helvetica, sans-serif;
+		box-shadow:none;
+		width: 270px;
+		height:30px;
+		background: black;
+		border: 0;
+		padding: 8px 15px;
+		font-size: 11px;
+		color: #737373;
+		margin: 2px 0 0 0;
+		
+		box-sizing: content-box;
+		-moz-box-sizing: content-box;
+	}
+	
+	#fb7 #fb7-contact form input {
+		height: 15px;
+	    max-height:15px;
+		min-height:15px;
+	}
+
+	#fb7 #fb7-contact form textarea {
+		height: 60px;		
+		resize: none;
+		max-height:60px;
+		min-height:60px;
+		-moz-box-sizing:inherit;
+		box-sizing:inherit;
+		
+		
+	}
+
+	#fb7 #fb7-contact button,
+	#fb7 #fb7-contact .fb7-close {
+			    border-radius: 4px;
+		   -moz-border-radius: 4px;
+		-webkit-border-radius: 4px;
+	}
+
+	#fb7 #fb7-contact button {
+		height:18px;
+		background: #64c8d3;
+		margin: 10px 0 0 100px;
+		padding: 4px 8px;
+		text-align: center;
+		font-family:Arial, Helvetica, sans-serif;
+		/*text-transform: uppercase;/*/
+		font-size: 11px;
+		color: white;
+			    border-radius: 4px;
+		   -moz-border-radius: 4px;
+		-webkit-border-radius: 4px;
+	}
+
+	#fb7 #fb7-contact .fb7-close {
+		position: absolute; right: 15px; top: 10px; z-index: 5;
+		background: #64c8d3;
+		padding: 2px 5px;
+		line-height: 12px;
+		font-size: 11px;
+		color: black;
+	}
+
+	#fb7 #fb7-contact .fb7-error { 
+	
+	color: white; 
+	
+	}
+
+	#fb7 #fb7-contact .fb7-thanks {
+		 color:#444444;
+		 display: none;
+	}
+	
+	#fb7 #fb7-contact .fb7-thanks h1 {
+		 font-size:18px;
+		 color:#444 444;
+	}
+	
+	#fb7 #fb7-contact .fb7-thanks p {
+		 font-size:11px;
+		 color:#444444;
+	}
+
+	
+

public/assets/index/picture/css/preloader.css

@@ -0,0 +1,366 @@
+
+
+/* Preloader /*/
+
+#fb6 .fb6-preloader {
+position: relative;
+width: 90px;
+height:90px;
+
+/*position /*/
+position:absolute;
+top:50%;
+left:50%;
+z-index:101;
+margin-left:-45px;
+margin-top:-65px;
+
+/*position /*/
+}
+
+#fb6 .fb6-preloader .wBall {
+position: absolute;
+width: 86px;
+height: 86px;
+opacity: 0;
+-moz-transform: rotate(225deg);
+-moz-animation: orbit 7.15s infinite;
+-webkit-transform: rotate(225deg);
+-webkit-animation: orbit 7.15s infinite;
+-ms-transform: rotate(225deg);
+-ms-animation: orbit 7.15s infinite;
+-o-transform: rotate(225deg);
+-o-animation: orbit 7.15s infinite;
+transform: rotate(225deg);
+animation: orbit 7.15s infinite;
+}
+
+#fb6 .fb6-preloader .wBall .wInnerBall{
+position: absolute;
+width: 11px;
+height: 11px;
+background:#64C8D3;
+left:0px;
+top:0px;
+-moz-border-radius: 11px;
+-webkit-border-radius: 11px;
+-ms-border-radius: 11px;
+-o-border-radius: 11px;
+border-radius: 11px;
+}
+
+#fb6 .fb6-preloader #wBall_1 {
+-moz-animation-delay: 1.56s;
+-webkit-animation-delay: 1.56s;
+-ms-animation-delay: 1.56s;
+-o-animation-delay: 1.56s;
+animation-delay: 1.56s;
+}
+
+#fb6 .fb6-preloader #wBall_2 {
+-moz-animation-delay: 0.31s;
+-webkit-animation-delay: 0.31s;
+-ms-animation-delay: 0.31s;
+-o-animation-delay: 0.31s;
+animation-delay: 0.31s;
+}
+
+#fb6 .fb6-preloader #wBall_3 {
+-moz-animation-delay: 0.62s;
+-webkit-animation-delay: 0.62s;
+-ms-animation-delay: 0.62s;
+-o-animation-delay: 0.62s;
+animation-delay: 0.62s;
+}
+
+#fb6 .fb6-preloader #wBall_4 {
+-moz-animation-delay: 0.94s;
+-webkit-animation-delay: 0.94s;
+-ms-animation-delay: 0.94s;
+-o-animation-delay: 0.94s;
+animation-delay: 0.94s;
+}
+
+#fb6 .fb6-preloader #wBall_5 {
+-moz-animation-delay: 1.25s;
+-webkit-animation-delay: 1.25s;
+-ms-animation-delay: 1.25s;
+-o-animation-delay: 1.25s;
+animation-delay: 1.25s;
+}
+
+@-moz-keyframes orbit {
+0% {
+opacity: 1;
+z-index:99;
+-moz-transform: rotate(180deg);
+-moz-animation-timing-function: ease-out;
+}
+
+7% {
+opacity: 1;
+-moz-transform: rotate(300deg);
+-moz-animation-timing-function: linear;
+-moz-origin:0%;
+}
+
+30% {
+opacity: 1;
+-moz-transform:rotate(410deg);
+-moz-animation-timing-function: ease-in-out;
+-moz-origin:7%;
+}
+
+39% {
+opacity: 1;
+-moz-transform: rotate(645deg);
+-moz-animation-timing-function: linear;
+-moz-origin:30%;
+}
+
+70% {
+opacity: 1;
+-moz-transform: rotate(770deg);
+-moz-animation-timing-function: ease-out;
+-moz-origin:39%;
+}
+
+75% {
+opacity: 1;
+-moz-transform: rotate(900deg);
+-moz-animation-timing-function: ease-out;
+-moz-origin:70%;
+}
+
+76% {
+opacity: 0;
+-moz-transform:rotate(900deg);
+}
+
+100% {
+opacity: 0;
+-moz-transform: rotate(900deg);
+}
+
+}
+
+@-webkit-keyframes orbit {
+0% {
+opacity: 1;
+z-index:99;
+-webkit-transform: rotate(180deg);
+-webkit-animation-timing-function: ease-out;
+}
+
+7% {
+opacity: 1;
+-webkit-transform: rotate(300deg);
+-webkit-animation-timing-function: linear;
+-webkit-origin:0%;
+}
+
+30% {
+opacity: 1;
+-webkit-transform:rotate(410deg);
+-webkit-animation-timing-function: ease-in-out;
+-webkit-origin:7%;
+}
+
+39% {
+opacity: 1;
+-webkit-transform: rotate(645deg);
+-webkit-animation-timing-function: linear;
+-webkit-origin:30%;
+}
+
+70% {
+opacity: 1;
+-webkit-transform: rotate(770deg);
+-webkit-animation-timing-function: ease-out;
+-webkit-origin:39%;
+}
+
+75% {
+opacity: 1;
+-webkit-transform: rotate(900deg);
+-webkit-animation-timing-function: ease-out;
+-webkit-origin:70%;
+}
+
+76% {
+opacity: 0;
+-webkit-transform:rotate(900deg);
+}
+
+100% {
+opacity: 0;
+-webkit-transform: rotate(900deg);
+}
+
+}
+
+@-ms-keyframes orbit {
+0% {
+opacity: 1;
+z-index:99;
+-ms-transform: rotate(180deg);
+-ms-animation-timing-function: ease-out;
+}
+
+7% {
+opacity: 1;
+-ms-transform: rotate(300deg);
+-ms-animation-timing-function: linear;
+-ms-origin:0%;
+}
+
+30% {
+opacity: 1;
+-ms-transform:rotate(410deg);
+-ms-animation-timing-function: ease-in-out;
+-ms-origin:7%;
+}
+
+39% {
+opacity: 1;
+-ms-transform: rotate(645deg);
+-ms-animation-timing-function: linear;
+-ms-origin:30%;
+}
+
+70% {
+opacity: 1;
+-ms-transform: rotate(770deg);
+-ms-animation-timing-function: ease-out;
+-ms-origin:39%;
+}
+
+75% {
+opacity: 1;
+-ms-transform: rotate(900deg);
+-ms-animation-timing-function: ease-out;
+-ms-origin:70%;
+}
+
+76% {
+opacity: 0;
+-ms-transform:rotate(900deg);
+}
+
+100% {
+opacity: 0;
+-ms-transform: rotate(900deg);
+}
+
+}
+
+@-o-keyframes orbit {
+0% {
+opacity: 1;
+z-index:99;
+-o-transform: rotate(180deg);
+-o-animation-timing-function: ease-out;
+}
+
+7% {
+opacity: 1;
+-o-transform: rotate(300deg);
+-o-animation-timing-function: linear;
+-o-origin:0%;
+}
+
+30% {
+opacity: 1;
+-o-transform:rotate(410deg);
+-o-animation-timing-function: ease-in-out;
+-o-origin:7%;
+}
+
+39% {
+opacity: 1;
+-o-transform: rotate(645deg);
+-o-animation-timing-function: linear;
+-o-origin:30%;
+}
+
+70% {
+opacity: 1;
+-o-transform: rotate(770deg);
+-o-animation-timing-function: ease-out;
+-o-origin:39%;
+}
+
+75% {
+opacity: 1;
+-o-transform: rotate(900deg);
+-o-animation-timing-function: ease-out;
+-o-origin:70%;
+}
+
+76% {
+opacity: 0;
+-o-transform:rotate(900deg);
+}
+
+100% {
+opacity: 0;
+-o-transform: rotate(900deg);
+}
+
+}
+
+@keyframes orbit {
+0% {
+opacity: 1;
+z-index:99;
+transform: rotate(180deg);
+animation-timing-function: ease-out;
+}
+
+7% {
+opacity: 1;
+transform: rotate(300deg);
+animation-timing-function: linear;
+origin:0%;
+}
+
+30% {
+opacity: 1;
+transform:rotate(410deg);
+animation-timing-function: ease-in-out;
+origin:7%;
+}
+
+39% {
+opacity: 1;
+transform: rotate(645deg);
+animation-timing-function: linear;
+origin:30%;
+}
+
+70% {
+opacity: 1;
+transform: rotate(770deg);
+animation-timing-function: ease-out;
+origin:39%;
+}
+
+75% {
+opacity: 1;
+transform: rotate(900deg);
+animation-timing-function: ease-out;
+origin:70%;
+}
+
+76% {
+opacity: 0;
+transform:rotate(900deg);
+}
+
+100% {
+opacity: 0;
+transform: rotate(900deg);
+}
+
+}
+

public/assets/index/picture/css/reset.css

@@ -0,0 +1,65 @@
+/* --------------------------------------------------------------
+
+   reset.css
+   * Resets default browser CSS.
+
+-------------------------------------------------------------- */
+
+
+
+#fb7,#fb7 a,#fb7 abbr,#fb7 address,#fb7 article,#fb7 aside,#fb7 audio,#fb7 b,#fb7 blockquote, #fb7 button,#fb7 canvas, 
+#fb7 caption,#fb7 cite,#fb7 code,#fb7 dd,#fb7 del,#fb7 details,#fb7 dfn,#fb7 div,#fb7 dl,#fb7 dt,#fb7 em,#fb7 embed,#fb7 fieldset,
+#fb7 figcaption,#fb7 figure,#fb7 footer,#fb7 form,#fb7 h1,#fb7 h2,#fb7 h3,#fb7 h4,#fb7 h5,#fb7 h6,#fb7 header,#fb7 hgroup,#fb7 i,#fb7 iframe,#fb7 img,#fb7 ins,#fb7 kbd,#fb7 label,#fb7 legend,#fb7.fb6 li,#fb7 mark,#fb7 menu,#fb7 nav, 
+#fb7 object,#fb7 ol,#fb7 p,#fb7 pre,#fb7 q,#fb7 samp,#fb7 section,#fb7 small,#fb7 span,#fb7 sub,#fb7 summary,#fb7 sup,#fb7 table,#fb7 tbody,#fb7 td,#fb7 tfoot,#fb7 th,#fb7 thead,#fb7 time,#fb7 tr,#fb7 ul,#fb7 var,#fb7 video,#fb7 input {
+	margin: 0;
+	padding: 0;
+	border: 0;
+	border-radius:0;
+	font-size: 100%;
+	font-weight: inherit;
+	font-style: inherit;
+	vertical-align: baseline;
+	line-height:1.5;
+	text-align:left;
+	
+	box-shadow:none;
+	text-shadow:none;
+	overflow:visible;
+	background:none;
+	list-style:none;	
+	background-image: none
+	display:none;
+	box-sizing:content-box;
+	-moz-box-sizing:content-box;
+}
+
+#fb7.fb6 li, #fb7 li:before, #fb7:after {
+    content:none;
+}
+
+#fb7 img {
+		
+}
+
+#fb7 article,#fb7 aside,#fb7 canvas,#fb7 details,#fb7 figcaption,#fb7 figure,#fb7 footer,#fb7 header,#fb7 hgroup,#fb7 menu,#fb7 nav,#fb7 section,#fb7 summary { display: block; }
+
+#fb7 a,#fb7 ins,#fb7 del { text-decoration: none; }
+
+#fb7 ul,#fb7 ol {
+	 list-style: none;
+	 text-indent:0px;
+	 margin:0 !important;
+}
+
+#fb7 table {
+	border-spacing: 0;
+	border-collapse: collapse; }
+
+#fb7 caption,#fb7 th { text-align: left; }
+
+#fb7 q:after,#fb7 q:before { content: ""; }
+
+#fb7 a,#fb7 button:hover { cursor: pointer; }
+
+#fb7 input,#fb7 textarea { outline: none; }
+

public/assets/index/picture/css/static.css

@@ -0,0 +1,244 @@
+/* = Menu
+-------------------------------------------------------------- */
+
+#fb7 .fb7-menu {
+	
+}
+
+#fb7 .fb7-menu ul {
+	list-style: none; 
+	margin: 15px 0; padding: 0;	
+}
+
+#fb7 .fb7-menu li {
+	float: left ;
+	position: relative;
+	width: 38px;
+	height: 65px;
+	margin: 0;
+	padding:0px 2px 0 2px;
+	list-style: none;		
+	/*background: url(../img/icons.png) no-repeat/*/
+	background-position: -39px 0px ;
+	
+	border: 0px solid #F00;
+}
+
+#fb7 .fb7-menu li:last-child {
+	background-position:-76px 0px ;
+	padding:0;
+	width: 48px;
+	
+}
+
+#fb7 .fb7-menu li:first-child {
+	background-position:0px 0px ;
+	padding:0;
+	width: 48px;
+	
+}
+
+#fb7 .fb7-menu li a {
+	display: block;
+	background:inherit;
+	width: 38px;
+	height: 65px;
+	margin:-37px 0px;
+	
+	
+}
+
+#fb7 .fb7-menu li a.fb7-download				{ background-position: 0 -65px; }
+#fb7 .fb7-menu li a.fb7-download:hover			{ background-position: 0 -130px; }
+
+#fb7 .fb7-menu li a.fb7-home					{ background-position: -228px -65px; }
+#fb7 .fb7-menu li a.fb7-home:hover				{ background-position: -228px -130px; }
+
+#fb7 .fb7-menu li a.contact				        { background-position: -226px -5px; }
+#fb7 .fb7-menu li a.contact:hover			    { background-position: -226px -5px; }
+
+#fb7 .fb7-menu li a.fb7-fullscreen				{ background-position: -266px -65px; }
+#fb7 .fb7-menu li a.fb7-fullscreen:hover		{ background-position: -266px -130px; }
+
+
+#fb7 .fb7-menu li a.fb7-show-all				{ background-position: -190px -65px; }
+#fb7 .fb7-menu li a.fb7-show-all:hover			{ background-position: -190px -130px; }
+
+#fb7 .fb7-menu li a.fb7-zoom-auto				{ background-position: -114px -65px; }
+#fb7 .fb7-menu li a.fb7-zoom-auto:hover		    { background-position: -114px -130px; }
+	
+#fb7 .fb7-menu li a.fb7-zoom-in				    { background-position: -76px -65px; }
+#fb7 .fb7-menu li a.fb7-zoom-in:hover			{ background-position: -76px -130px; }
+	
+#fb7 .fb7-menu li a.fb7-zoom-original			{ background-position: -152px -65px; }
+#fb7 .fb7-menu li a.fb7-zoom-original:hover	    { background-position: -152px -130px; }
+
+#fb7 .fb7-menu li a.fb7-zoom-out				{ background-position: -37px -65px; }
+#fb7 .fb7-menu li a.fb7-zoom-out:hover			{ background-position: -37px -130px; }
+
+
+#fb7 .fb7-menu#fb7-center {
+	width: auto;
+	margin-top: 14px;
+	margin-down: 0;
+	position:absolute;
+	
+	/*
+	margin-left: auto;
+	margin-right: auto;
+    /*/
+}
+
+#fb7 .fb7-menu#fb7-right {
+	float: right;
+	width: auto;
+	margin: 15px 6px 0 0;
+}
+
+#fb7 .fb7-menu#fb7-right li {
+	background:none;
+}
+
+
+#fb7 .fb7-menu li.fb7-goto {
+	position: relative;
+	width: auto;
+	margin: -6px 4px 0px 0;
+	padding: 6px 0 0 10px;
+}
+
+#fb7 .fb7-menu li.fb7-goto #fb7-label-page-number {
+	font-family:Arial,sans-serif;
+	display:inline;
+	float: left;
+	margin: 6px 5px 0 0;
+	line-height: 12px;
+	font-size: 10px; font-weight: bold;
+	color: #5f6f7b;
+	-webkit-font-smoothing: antialiased;
+	width:auto;
+}
+
+
+#fb7 .fb7-menu li.fb7-goto input[type='text'] {
+	background: #141f28;
+	width: 28px;
+	height: 29px;		
+	padding: 0 25px 0 7px;
+	text-align: center;
+	font-size: 14px;
+	font-family:Nunito;
+	font-weight:bold;
+	color: #616465;
+	display:inline;
+	border-radius:25px;
+	box-shadow:inset 1px 2px 3px #CCCCCC;
+}
+
+#fb7 .fb7-menu li.fb7-goto input[type='text'].focus_input  {
+
+	box-shadow:0 0 7px 2px #97dcea;
+}
+	
+#fb7 .fb7-menu li.fb7-goto button {
+	text-shadow:none;
+	font-family:Nunito,sans-serif;
+	position: absolute; 
+	right: 1px; 
+	top: 7px;
+	height:29px;
+	width:40px;
+	border:3px solid;
+    border-top-right-radius:3em;
+	border-bottom-right-radius:3em;
+
+	/*border:1px solid #EBEEF0;/*/
+	display:inline;
+	font-size: 11px;
+	text-align:center;
+	font-weight: bold;
+	padding: 0 1px;
+	background:#FF0000;
+	color: #5f6f7b;
+	cursor:pointer;
+}
+
+#fb7 .ui-btn-text { display: none; }
+
+
+/* = Tooltip
+-------------------------------------------------------------- */
+
+#fb7 .fb7-tooltip {
+	font-family:Nunito,sans-serif;
+	position: absolute; left: 0; top: -25px; z-index: 5;
+	display: none;
+	padding: 2px 10px;
+	background: #64c8d3;
+	white-space: nowrap;
+	font-size: 10px;
+	font-weight: bold;
+	/*text-transform: uppercase/*/
+	color: #616465;
+	
+	background: -webkit-linear-gradient(#FFFFFF,#EAEAEA); /* For Safari 5.1 to 6.0 */
+	background: -o-linear-gradient(#FFFFFF,#EAEAEA); /* For Opera 11.1 to 12.0 */
+	background: -moz-linear-gradient(#FFFFFF,#EAEAEA); /* For Firefox 3.6 to 15 */
+	background: linear-gradient(#FFFFFF,#EAEAEA); /* Standard syntax */
+	
+	
+	border-radius: 1px;
+	border:1px solid #D4D4D4;
+	box-shadow: 0 0 1px 1px #DBDBDB;
+	font-size:12px;
+}
+	
+	/*
+	#fb7 .fb7-tooltip b {
+		
+    border-right: 10px solid rgba(0, 0, 0, 0);
+    border-top: 10px solid #64c8d3;
+    bottom: -7px;
+    display: block;
+    height: 0;
+    left: 6px;
+    position: absolute;
+    width: 0;
+	}
+	/*/
+
+
+/* = Footer
+-------------------------------------------------------------- */
+
+#fb7 #fb7-footer {
+   opacity:0;	
+}
+
+#fb7 #fb7-footer {
+	position: absolute; bottom: 0px; z-index: 15;
+	left:0px;
+	/*background: url(../img/bg-footer.png);/*/
+	/*background-color: rgba(0, 0, 0, .55);/*/
+	/*border-top: 3px solid #0A334A;/*/
+	width: 100%; height: 60px;
+	margin: 0; padding: 0;
+
+}
+
+#fb7 #fb7-footer #fb7-logo {
+		position: absolute; left: 10px; top: 18px; z-index: 5;
+}
+
+#fb7 #fb7-footer .fb7-bcg-tools {
+    background-color: #000000;
+    height: 100%;
+    left: 0;
+    opacity: 0.55;
+    position: absolute;
+    top: 0;
+    width: 100%;
+	
+}
+
+

public/assets/index/picture/css/style.css

@@ -0,0 +1,983 @@
+@import url('reset.css');
+@import url('static.css');
+@import url('elements.css');
+@import url('preloader.css');
+
+
+
+#fb7{
+   font-family:Arial,sans-serif;
+   font-size:14px;
+   -webkit-text-size-adjust:none;
+   position:relative;
+   overflow:hidden;
+   margin:0 auto;
+   display:block;
+   width:100%;
+   height:300px;
+   opacity:0;
+   margin-bottom:30px;
+}
+
+
+/* =  Shadow for flipbook
+--------------------------*/
+
+#fb7 .fb7-shadow {
+	height:100%;
+	position:absolute;
+	top:0px;
+	box-shadow: 0px 0px 10px 1px #999;
+	border-top-left-radius: 25px;
+	border-bottom-left-radius: 25px;
+	border-top-right-radius: 25px;
+	border-bottom-right-radius: 25px;
+}
+
+#fb7 .fb7-shadow-double {
+	width:100%;
+	left:0%;
+}
+
+#fb7 .fb7-shadow-right {
+	width:50%;
+	left:50%;
+	border-top-left-radius: 0px !important;
+	border-bottom-left-radius: 0px !important;
+}
+
+#fb7 .fb7-shadow-left {
+	width:50%;
+	left:0%;
+	border-top-right-radius: 0px !important;
+	border-bottom-right-radius: 0px !important;
+}
+
+
+/* =  Gradient ( for right page )
+--------------------------*/
+
+#fb7 .turn-page.even .fb7-cont-page-book {
+
+background: -moz-linear-gradient(left,  rgba(0,0,0,0.27) 0%, rgba(255,255,255,0) 7%); /* FF3.6+ */
+background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0.27)), color-stop(7%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
+background: -webkit-linear-gradient(left,  rgba(0,0,0,0.27) 0%,rgba(255,255,255,0) 7%); /* Chrome10+,Safari5.1+ */
+background: -o-linear-gradient(left,  rgba(0,0,0,0.27) 0%,rgba(255,255,255,0) 7%); /* Opera 11.10+ */
+background: -ms-linear-gradient(left,  rgba(0,0,0,0.27) 0%,rgba(255,255,255,0) 7%); /* IE10+ */
+background: linear-gradient(to right,  rgba(0,0,0,0.27) 0%,rgba(255,255,255,0) 7%); /* W3C */
+filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45000000', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 */
+
+
+}
+
+/* =  Gradient ( for left page )
+--------------------------*/
+
+#fb7 .turn-page.odd .fb7-cont-page-book {
+
+background: -moz-linear-gradient(right,  rgba(0,0,0,0.27) 0%, rgba(255,255,255,0) 7%); /* FF3.6+ */
+background: -webkit-gradient(linear, right top, right top, color-stop(0%,rgba(0,0,0,0.27)), color-stop(7%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
+background: -webkit-linear-gradient(right,  rgba(0,0,0,0.27) 0%,rgba(255,255,255,0) 7%); /* Chrome10+,Safari5.1+ */
+background: -o-linear-gradient(right,  rgba(0,0,0,0.27) 0%,rgba(255,255,255,0) 7%); /* Opera 11.10+ */
+background: -ms-linear-gradient(right,  rgba(0,0,0,0.27) 0%,rgba(255,255,255,0) 7%); /* IE10+ */
+background: linear-gradient(to left,  rgba(0,0,0,0.27) 0%,rgba(255,255,255,0) 7%); /* W3C */
+filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45000000', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 */
+
+
+
+}
+
+
+/* corner left page /*/
+
+#fb7 .turn-page.odd{
+
+border-top-left-radius: 25px;
+border-bottom-left-radius: 25px;
+
+border-top-right-radius: 0px;
+border-bottom-right-radius: 0px;
+
+}
+
+/* corner right page /*/
+
+#fb7 .turn-page.even{
+
+border-top-right-radius: 25px;
+border-bottom-right-radius: 25px;
+
+border-top-left-radius: 0px;
+border-bottom-left-radius: 0px;
+
+}
+
+
+#fb7.fullScreen,#fb7-ajax[data-template="true"] #fb7{
+   margin-bottom:0;
+}
+
+
+#fb7 #fb7-container-book {
+	position: absolute;
+	z-index: 5;
+	display: none;
+	width: 1280px; height: 920px;
+}
+
+
+#fb7 fieldset{
+
+
+}
+
+
+#fb7 #fb7-deeplinking{
+  display:none;
+}
+
+
+#fb7 .fb7-bcg-book{
+    background: none no-repeat center center;
+	background-size:cover;
+	-moz-background-size:cover;
+	-webkit-background-size:cover;
+    width:100%;
+	height:100%;
+}
+
+#test{
+   margin:0 auto;
+   width:100%;
+}
+
+#fb7 #page.mobile {
+		width: 640px; height: 358px;
+		margin: -210px 0 0 -275px;
+	}
+
+#fb7 #page .padding { /*padding: 0 34px;*/ }
+
+
+
+#fb7 .cursor-grab {
+	cursor: -webkit-grab;
+	cursor: -moz-grab;
+}
+
+
+#fb7 .fb7-overlay {
+	position: absolute; left: -10000px; top: 0; z-index: 20;
+
+	/*background: url(../img/bg-overlay.png);/*/
+	background:rgba(0,0,0,0);
+
+	width: 100%; height: 100%;
+	display:none;
+}
+
+#fb7 .fb7-overlay.active { left: 0; display:block; }
+
+
+/* = Back button
+-------------------------------------------------------------- */
+   #fb7 #fb7-button-back{
+
+	text-decoration: none;
+
+	font-family:Nunito,​sans-serif;
+
+	color:#393939;
+	position:absolute;
+	left:-5px;
+	top:45px;
+	box-shadow:0 0 2px 2px #BEBEBE;
+
+	background: -webkit-linear-gradient(#FFFFFF,#EAEAEA); /* For Safari 5.1 to 6.0 */
+	background: -o-linear-gradient(#FFFFFF,#EAEAEA); /* For Opera 11.1 to 12.0 */
+	background: -moz-linear-gradient(#FFFFFF,#EAEAEA); /* For Firefox 3.6 to 15 */
+	background: linear-gradient(#FFFFFF,#EAEAEA); /* Standard syntax */
+
+	border-radius: 5px 5px 5px 5px;
+	border:1px solid #B9B9B9;
+	padding:5px;
+	padding-left:15px;
+	padding-right:10px;
+	font-size:12px;
+	font-weight:bold;
+	margin-top:-45px;
+  }
+
+
+/* = About
+-------------------------------------------------------------- */
+
+	#fb7 #fb7-about {
+		position: absolute; z-index: 5;
+		width: 45%; display: none;
+
+		/*padding-top: 6%;/*/
+	}
+
+	#fb7 #fb7-about h1,
+	#fb7 #fb7-about h2,
+	#fb7 #fb7-about h3,
+	#fb7 #fb7-about h4,
+	#fb7 #fb7-about h5,
+	#fb7 #fb7-about h6 {
+		margin: 0 0 2% 0;
+		padding:0px;
+		font-size: 1.375em;
+		color: #64c8d3;
+		-webkit-font-smoothing: antialiased;
+		text-transform:none;
+		font-weight:300;
+	}
+
+
+	#fb7 #fb7-about h1{
+		/*background: url(../img/icons.png) no-repeat;/*/
+		padding: 0 0 0px 0px;
+	}
+
+	#fb7 #fb7-about ul,#fb7-about ol {
+		list-style:disc;
+		margin: 0;
+		padding-left:10px;
+		padding-top:0%;
+		padding-bottom:2%;
+	}
+
+	#fb7 #fb7-about li {
+		color: #cfeaee;
+		margin-bottom:4px;
+	}
+
+
+	#fb7 #fb7-about p {
+		/*font-size: 0.688em;/*/
+		color: #cfeaee;
+		margin-bottom:8%;
+		margin-top:0%;
+
+
+	}
+
+	#fb7 #fb7-about a {
+		color:#ffffff;
+		text-decoration:underline;
+	}
+
+	#fb7 #fb7-about a:hover {
+		/*color:#ffffff;/*/
+		text-decoration:none;
+	}
+
+
+
+/* = Book
+-------------------------------------------------------------- */
+
+#fb7 #fb7-book {
+	position: relative; z-index: 10;
+	width: 100%; height:100%;
+}
+
+#fb7 #fb7-book .turn-page {
+	background-color:#FFF;
+	background-size: 100% 100%;
+}
+
+#fb7 .fb7-double {
+	background-size: 200% 100% !important;
+}
+
+#fb7 .fb7-double.fb7-first {
+	background-position: 0% 0%;
+}
+
+#fb7 .fb7-double.fb7-second {
+	background-position: -100% 0%;
+}
+
+
+
+
+
+
+
+
+	/* = Nav Arrows
+	---------------------------------------- */
+
+	#fb7 .fb7-nav-arrow {
+		position: absolute; top: 50%; z-index: 15;
+		/*background: url(../img/icons.png);/*/
+		width: 158px; height: 100px;
+		margin-top: -50px;
+		cursor:pointer;
+	}
+
+	#fb7 .fb7-nav-arrow.next		{ right: 0px; background-position: -174px -205px; }
+	#fb7 .fb7-nav-arrow.next:hover	{ background-position: -174px -315px; }
+
+	#fb7 .fb7-nav-arrow.prev			{  background-position: 0px -205px ; display: none; }
+	#fb7 .fb7-nav-arrow.prev:hover	{ background-position: 0px -315px; }
+
+	#fb7 .fb7-nav-arrow.next{
+		transform-origin:0 center;
+		-ms-transform-origin:0 center;
+		-webkit-transform-origin:0 center;
+    }
+
+	#fb7 .fb7-nav-arrow.prev{
+		transform-origin:right center;
+		-ms-transform-origin:right center;
+		-webkit-transform-origin:right center;
+    }
+
+		/*#page.mobile .fb7-nav-arrow.next { right: -24px; }*/
+
+
+
+	/* = Cover
+	---------------------------------------- */
+
+	#fb7 #fb7-logo-cover {
+		position: absolute; right: 10px; bottom: 10px; z-index: 5;
+	}
+
+	#fb7 #fb7-cover ul {
+		position:absolute;
+		top:50%;
+		-webkit-transform: translate(0,-50%);
+        -ms-transform: translate(0,-50%);
+		-moz-transform: translate(0,-50%);
+		-o-transform: translate(0,-50%);
+        transform: translate(0,-50%);
+		clear: both;
+		width: 100%;
+		list-style: none;
+		padding: 20px 0;
+		border-top: 1px solid #e2e2e2;
+		border-bottom: 1px solid #e2e2e2;
+	}
+
+	#fb7 #fb7-cover ul:after { clear: both; content: ''; display: block; }
+
+	#fb7 #fb7-cover li {
+		float: left;
+		width: 28.3%;
+		margin: 0 2.5%;
+		list-style:none;
+	}
+
+	#fb7 #fb7-cover li,
+	#fb7 #fb7-cover img {
+		-moz-user-select: -moz-none;
+		-khtml-user-select: none;
+		-webkit-user-select: none;
+		user-select: none;
+		box-shadow:none;
+	}
+
+	#fb7 #fb7-cover li:last-child {
+		margin-right: 0;
+	}
+
+	#fb7 #fb7-cover li img {
+		float: left;
+		width: 100%;
+	}
+
+	#fb7 #fb7-cover li a:hover img {
+		/*opacity: .8;/*/
+	}
+
+
+
+	/* = End
+	---------------------------------------- */
+
+	#fb7 #end { text-align: center; }
+
+	#fb7 #end p { padding-top: 60%; }
+
+
+
+	/* = Meta data
+	---------------------------------------- */
+
+	#fb7 #fb7-book .fb7-meta {
+		position: absolute;
+		bottom: 2%;
+		left:48%;
+		width:45px;
+		height:45px;
+		text-align: center;
+
+		border-radius: 50%;
+	}
+
+
+	#fb7 .fb7-meta .fb7-num {
+		   line-height:43px;
+		   font-size:18px;
+		   font-weight:bold;
+		   text-shadow: 2px 2px 6px #666666;
+
+	}
+
+	/*
+
+	#fb7 .fb7-meta .fb7-description {
+			font-size: 11px;
+			color: #666;
+	        font-family:Arial,sans-serif;
+	}
+
+	#fb7 .fb7-meta.fb7-left {
+			left:3%;
+	}
+
+	#fb7 .fb7-meta.fb7-left .fb7-num {
+		    padding-right: 10px;
+	}
+
+	#fb7 .fb7-meta.fb7-right {
+			right:3%;
+			text-align: right;
+	}
+
+	#fb7 .fb7-meta.fb7-right .fb7-num {
+				padding-left: 10px;
+	}
+	/*/
+
+
+
+	/*= Video in lightbox
+	----------------------------*/
+
+	#v7_lightbox {
+		width:100%;
+		height:100%;
+		z-index:555789;
+		position:fixed;
+		display:block;
+		top:0px;
+	}
+
+	#v7_lightbox .bcg{
+		width:100%;
+		height:100%;
+		background-color:#000;
+		opacity:.7;
+		position:absolute;
+		cursor:pointer;
+	}
+
+
+	/* --------------------------*/
+
+	.fb7-cont-page-book{
+		position:absolute;
+	}
+
+	#fb7 .fb7-page-book {
+
+		position:absolute;
+	    -webkit-hyphens:none;
+        -moz-hyphens:none;
+        -ms-hyphens:none;
+        hyphens:none;
+		overflow:hidden;
+	}
+
+
+	#fb7 .fb7-page-book .center {
+		/*text-align:center;
+		padding-top:65%;/*/
+	}
+
+	#fb7 .fb7-page-book img {
+		border:none;
+		padding:0;
+	}
+
+	#fb7 .fb7-page-book p {
+		margin-bottom:20px;
+		line-height:1.5;
+
+	}
+
+	#fb7 .fb7-page-book p strong {
+		font-weight:bold;
+		-webkit-text-size-adjust:none;
+	}
+
+
+	#fb7 .fb7-page-book a {
+		text-decoration:underline;
+		color:#64C8D3;
+		/*font-weight:bold;/*/
+	}
+
+	#fb7 .fb7-page-book p a:hover {
+		text-decoration:none;
+	}
+
+	#fb7 .fb7-page-book h1,
+	#fb7 .fb7-page-book h2,
+	#fb7 .fb7-page-book h3,
+	#fb7 .fb7-page-book h4,
+	#fb7 .fb7-page-book h5,
+	#fb7 .fb7-page-book h6 {
+	   font-family:Arial,sans-serif;
+	   text-transform:none;
+	   margin-bottom:2%;
+
+
+
+	}
+
+	#fb7 .fb7-page-book ul {
+	    list-style: disc inside;
+		margin-bottom:3% !important;
+
+	}
+
+	#fb7 .fb7-page-book ul li {
+	   margin-bottom:2px;
+	   list-style: disc inside;
+	}
+
+	#fb7 .fb7-page-book ol{
+		margin-bottom:3% !important;
+	}
+
+	#fb7 .fb7-page-book ol li {
+	    list-style: decimal inside;
+		margin:0;
+	}
+
+
+	#fb7 .fb7-page-book ul li a, #fb7 .fb7-page-book ol li a {
+	   color:#77797F;
+	   font-weight:normal;
+	   text-decoration:none;
+	}
+
+	#fb7 .fb7-page-book ul li a:hover, #fb7 .fb7-page-book ol li a:hover {
+	   text-decoration:underline;
+	}
+
+	#fb7 .fb7-page-book a:hover img {
+       opacity:0.8;
+	}
+
+
+	/* =WordPress Core
+-------------------------------------------------------------- */
+#fb7 .fb7-page-book .alignnone,.#fb7-about .alignnone {
+    margin: 5px 20px 20px 0;
+}
+
+#fb7 .fb7-page-book.aligncenter,.fb7-page-book div.aligncenter,#fb7-about.aligncenter,#fb7-about div.aligncenter {
+    display: block;
+    margin: 5px auto 5px auto;
+}
+
+#fb7 .fb7-page-book .alignright,#fb7-about .alignright {
+    float:right;
+    margin: 5px 0 20px 20px;
+}
+
+#fb7 .fb7-page-book .alignleft,#fb7-about .alignleft {
+    float: left;
+    margin: 5px 20px 20px 0;
+}
+
+#fb7 .fb7-page-book .aligncenter,#fb7-about .aligncenter {
+    display: block;
+    margin: 5px auto 5px auto;
+}
+
+#fb7 .fb7-page-book a img.alignright,#fb7-about a img.alignright {
+    float: right;
+    margin: 5px 0 20px 20px;
+}
+
+#fb7 #fb7 .fb7-page-book a img.alignnone,#fb7-about a img.alignnone {
+    margin: 5px 20px 20px 0;
+}
+
+#fb7 .fb7-page-book a img.alignleft,#fb7-about a img.alignleft {
+    float: left;
+    margin: 5px 20px 20px 0;
+}
+
+#fb7 .fb7-page-book a img.aligncenter,#fb7-about a img.aligncenter {
+    display: block;
+    margin-left: auto;
+    margin-right: auto
+}
+
+#fb7 .fb7-page-book .wp-caption,#fb7-about .wp-caption {
+    background: #fff;
+    border: 1px solid #f0f0f0;
+    max-width: 96%; /* Image does not overflow the content area */
+    padding: 5px 3px 10px;
+    text-align: center;
+}
+
+#fb7 .fb7-page-book .wp-caption.alignnone,#fb7-about .wp-caption.alignnone {
+    margin: 5px 20px 20px 0;
+}
+
+#fb7 .fb7-page-book .wp-caption.alignleft,#fb7-about .wp-caption.alignleft {
+    margin: 5px 20px 20px 0;
+}
+
+#fb7 .fb7-page-book .wp-caption.alignright,#fb7-about .wp-caption.alignright {
+    margin: 5px 0 20px 20px;
+}
+
+.fb7-page-book .wp-caption img,#fb7-about .wp-caption img {
+    border: 0 none;
+    height: auto;
+    margin: 0;
+    max-width: 98.5%;
+    padding: 0;
+    width: auto;
+}
+
+#fb7 .fb7-page-book .wp-caption p.wp-caption-text,#fb7-about .wp-caption p.wp-caption-text {
+    font-size: 11px;
+    line-height: 17px;
+    margin: 0;
+    padding: 0 4px 5px;
+}
+
+
+
+/* = Media queries
+-------------------------------------------------------------- */
+
+@media screen and (max-width: 768px) {
+      /*
+    .fb7-nav-arrow.next{
+		transform-origin:0 center;
+		-ms-transform-origin:0 center;
+		-webkit-transform-origin:0 center;
+    }
+
+	 .fb7-nav-arrow.prev{
+		transform-origin:right center;
+		-ms-transform-origin:right center;
+		-webkit-transform-origin:right center;
+    }
+
+	.fb7-nav-arrow{
+		transform:scale(2);
+		ms-transform:scale(2);
+		-webkit-transform:scale(2);
+	}
+	/*/
+}
+
+
+
+ /* all icons for flipbook */
+		#fb7 .fb7-nav-arrow,#fb7 .fb7-menu li {
+		   background:url("../image/icons.png") no-repeat;
+	    }
+
+		#fb7 .fb7-menu li {
+	        background-position: -39px 0px ;
+		}
+
+
+
+
+	    /* background flipbook */
+		#fb7 .fb7-bcg-book{
+    		background:url("../image/bcg.jpg") no-repeat;
+		}
+
+
+
+		/* tools bar*/
+		#fb7 #fb7-footer .fb7-bcg-tools {
+		  background: -webkit-linear-gradient(#FFFFFF,#EAEAEA); /* For Safari 5.1 to 6.0 */
+		  background: -o-linear-gradient(#FFFFFF,#EAEAEA); /* For Opera 11.1 to 12.0 */
+		  background: -moz-linear-gradient(#FFFFFF,#EAEAEA); /* For Firefox 3.6 to 15 */
+		  background: linear-gradient(#FFFFFF,#EAEAEA); /* Standard syntax */
+		  border-radius:10px;
+		  border-bottom: 1px solid #FFFFFF;
+          box-shadow: 0 4px 0 #878787;
+		  opacity:0
+		}
+
+
+		#fb7 .fb7-tooltip{
+		 background: -webkit-linear-gradient(#284F06,#162B04)repeat scroll 0 0 rgba(0, 0, 0, 0) 		 background: -o-linear-gradient(#284F06,#162B04) repeat scroll 0 0 rgba(0, 0, 0, 0);
+		 background: -moz-linear-gradient(#284F06,#162B04) repeat scroll 0 0 rgba(0, 0, 0, 0);
+		 background: linear-gradient(#284F06,#162B04) repeat scroll 0 0 rgba(0, 0, 0, 0);
+	     border: 1px solid #488015;
+		 box-shadow: 0 0 1px 1px #000000;
+		 color:#FFFFFF;
+		}
+
+		/* logo /*/
+		#fb7 #fb7-footer #fb7-logo {
+			left: 12px;
+			top: -5px;
+		}
+
+
+		/*  page manager   /*/
+		#fb7 .fb7-menu li.fb7-goto input[type="text"] {
+		   	 color:#000000;
+			 background: none repeat scroll 0 0 #FFFFFF;
+			 border: 1px solid #566C43;
+		}
+
+		#fb7 .fb7-menu li.fb7-goto input[type='text'].focus_input  {
+	       box-shadow:0 0 7px 2px #4F9B09;
+        }
+
+
+		#fb7 .fb7-menu li.fb7-goto button {
+
+		  border:none;
+   		  color: #803900;
+		  background: -webkit-linear-gradient(#F6EE0D,#E7A506); /* For Safari 5.1 to 6.0 */
+		  background: -o-linear-gradient(#F6EE0D,#E7A506); /* For Opera 11.1 to 12.0 */
+		  background: linear-gradient(#F6EE0D,#E7A506); /* For Firefox 3.6 to 15 */
+		  background: linear-gradient(#F6EE0D,#E7A506); /* Standard syntax */
+		}
+
+
+
+
+		/* book /*/
+
+		#fb7 .fb7-shadow {
+						box-shadow: 0 0 10px 1px #666666;
+			        }
+
+		/* corner left page /*/
+		#fb7 .turn-page.odd{
+			border-top-left-radius:  0px;
+			border-bottom-left-radius:  0px;
+		}
+
+		/* corner right page /*/
+		#fb7 .turn-page.even{
+			border-top-right-radius:  0px;
+			border-bottom-right-radius:  0px;
+        }
+
+		#fb7 .fb7-shadow {
+			border-top-left-radius: 0px;
+			border-bottom-left-radius: 0px;
+			border-top-right-radius: 0px;
+			border-bottom-right-radius: 0px;
+		}
+
+		#fb7 .turn-page.fb7-noshadow .fb7-cont-page-book {
+
+	       background:none;
+		}
+
+
+		#fb7 #fb7-book .turn-page {
+	       background-color:#FFFFFF;
+        }
+
+		#fb7 #fb7-book .fb7-meta {
+		   background-position:-139px -9px;
+
+
+
+		   background: -webkit-radial-gradient(#D0D0D0,#A8A8A8); /* Safari 5.1 to 6.0 */
+		   background: -o-radial-gradient(#D0D0D0,#A8A8A8); /* For Opera 11.6 to 12.0 */
+		   background: -moz-radial-gradient(#D0D0D0,#A8A8A8); /* For Firefox 3.6 to 15 */
+		   background: radial-gradient(#D0D0D0,#A8A8A8); /* Standard syntax */
+
+
+           box-shadow:inset 0 0 4px 8px #ADADAD;
+
+
+		}
+
+		#fb7 .fb7-meta .fb7-num {
+		   /* text /*/
+		   color:#FFFFFF;
+		   text-shadow: 2px 2px 6px #666666;
+
+	    }
+
+
+
+		/* list thumbs /*/
+		#fb7 #fb7-all-pages .fb7-container-pages {
+		    background: none repeat scroll 0 0 #000000;
+						box-shadow: 0 0 40px rgba(245,220, 11, 0.8);
+		}
+
+		/* form /*/
+		#fb7 #fb7-contact form {
+   			 background: none repeat scroll 0 0 #161616;
+			 			 box-shadow: 0 0 60px rgba(100,200,211, 0.7);
+		}
+		#fb7 #fb7-contact form h3 {
+		    color: #FFFFFF;
+		}
+		#fb7 #fb7-contact button {
+			    background: none repeat scroll 0 0 #64C8D3;
+				color: #FFFFFF;
+		}
+		#fb7 #fb7-contact form input, #fb7-contact form textarea {
+           color: #737373;
+		}
+		#fb7 #fb7-contact .fb7-close {
+		  color: #000000;
+          background: none repeat scroll 0 0 #64C8D3;
+		}
+
+		#fb7 #fb7-contact .fb7-thanks p{
+		  color:#444444
+		}
+		#fb7 #fb7-contact .fb7-thanks h1{
+		  color:#FFFFFF
+		}
+
+
+
+		/* preloader /*/
+		#fb7 .fb7-preloader .wBall .wInnerBall{
+            background:#F5DC0B;
+		}
+
+
+		/* arrow gif /*/
+		#fb7 .fb7-nav-arrow {
+
+		}
+
+
+
+		/* formatt page for flipbook  /*/
+		#fb7 .fb7-page-book p {
+		   color:#77797F;
+		   font-family:Nunito;
+		   font-size:14px;
+	    }
+		#fb7 .fb7-page-book a {
+		   color:#000000;
+		 }
+		#fb7 .fb7-page-book h1 {
+	   	   color:#2E577C;
+		   font-family:Nunito;
+		   font-size:28px;
+	    }
+		#fb7 .fb7-page-book h2 {
+	   	   color:#2E577C;
+		   font-family:Nunito;
+		   font-size:26px;
+	    }
+		#fb7 .fb7-page-book h3 {
+	   	   color:#2E577C;
+		   font-family:Nunito;
+		   font-size:24px;
+	    }
+		#fb7 .fb7-page-book h4 {
+	   	   color:#2E577C;
+		   font-family:Nunito;
+		   font-size:22px;
+	    }
+		#fb7 .fb7-page-book h5 {
+	   	   color:#2E577C;
+		   font-family:Nunito;
+		   font-size:20px;
+	    }
+		#fb7 .fb7-page-book h6 {
+	   	   color:#2E577C;
+		   font-family:Nunito;
+		   font-size:18px;
+	    }
+		#fb7 .fb7-page-book li {
+           color:#77797F;
+		   font-family:Nunito;
+		   font-size:14px;
+		}
+		#fb7 .fb7-page-book ul li a,#fb7 .fb7-page-book ol li a {
+	        color:#2E577C;
+		}
+
+
+		/*  about style  /*/
+		#fb7 #fb7-about p,#fb7 #fb7-about li {
+		   color: #344F02;
+		   font-family:Nunito;
+		   font-size:15px;
+	    }
+		#fb7 #fb7-about a {
+		  color:#FFFFFF
+		}
+		#fb7 #fb7-about h1 {
+		   color: #FFFFFF;
+		   font-family:Nunito;
+		   font-size:30px;
+	    }
+
+
+		#fb7 #fb7-about h2 {
+		   color: #FFFFFF;
+		   font-family:Nunito;
+		   font-size:24px;
+	    }
+		#fb7 #fb7-about h3 {
+		   color: #FFFFFF;
+		   font-family:Nunito;
+		   font-size:22px;
+	    }
+		#fb7 #fb7-about h4 {
+		   color: #FFFFFF;
+		   font-family:Nunito;
+	    }
+		#fb7 #fb7-about h5 {
+		   color: #FFFFFF;
+		   font-family:Nunito;
+		   font-size:18px;
+	    }
+		#fb7 #fb7-about h6 {
+		   color: #FFFFFF;
+		   font-family:Nunito;
+		   font-size:16px;
+	    }
+		/* back  button /*/
+		#fb7 #fb7-button-back {
+    		color: #803900;
+
+			background: -webkit-linear-gradient(#F6EE0D,#E7A506); /* For Safari 5.1 to 6.0 */
+			background: -o-linear-gradient(#F6EE0D,#E7A506); /* For Opera 11.1 to 12.0 */
+			background: -moz-linear-gradient(#F6EE0D,#E7A506); /* For Firefox 3.6 to 15 */
+			background: linear-gradient(#F6EE0D,#E7A506); /* Standard syntax */
+
+							box-shadow: none;
+
+							border: 1px solid #488015;
+
+		}
+
+
+
+		/*  Other style   /*/
+		#fb7 .fb7-overlay {
+			                	background:rgba(0,0,0,0.6);
+        }
+
+

public/assets/index/picture/js/jquery.address-1.6.min.js

@@ -0,0 +1,20 @@
+/*! jQuery Address v1.6 | (c) 2009, 2013 Rostislav Hristov | jquery.org/license */
+(function(c){c.address=function(){var s=function(a){a=c.extend(c.Event(a),function(){for(var b={},f=c.address.parameterNames(),m=0,p=f.length;m<p;m++)b[f[m]]=c.address.parameter(f[m]);return{value:c.address.value(),path:c.address.path(),pathNames:c.address.pathNames(),parameterNames:f,parameters:b,queryString:c.address.queryString()}}.call(c.address));c(c.address).trigger(a);return a},g=function(a){return Array.prototype.slice.call(a)},k=function(){c().bind.apply(c(c.address),Array.prototype.slice.call(arguments));
+return c.address},da=function(){c().unbind.apply(c(c.address),Array.prototype.slice.call(arguments));return c.address},G=function(){return A.pushState&&d.state!==h},T=function(){return("/"+n.pathname.replace(new RegExp(d.state),"")+n.search+(H()?"#"+H():"")).replace(S,"/")},H=function(){var a=n.href.indexOf("#");return a!=-1?n.href.substr(a+1):""},q=function(){return G()?T():H()},U=function(){return"javascript"},M=function(a){a=a.toString();return(d.strict&&a.substr(0,1)!="/"?"/":"")+a},t=function(a,
+b){return parseInt(a.css(b),10)},C=function(){if(!I){var a=q();if(decodeURI(e)!=decodeURI(a))if(v&&x<7)n.reload();else{v&&!J&&d.history&&u(N,50);e=a;B(o)}}},B=function(a){u(ea,10);return s(V).isDefaultPrevented()||s(a?W:X).isDefaultPrevented()},ea=function(){if(d.tracker!=="null"&&d.tracker!==D){var a=c.isFunction(d.tracker)?d.tracker:i[d.tracker],b=(n.pathname+n.search+(c.address&&!G()?c.address.value():"")).replace(/\/\//,"/").replace(/^\/$/,"");if(c.isFunction(a))a(b);else if(c.isFunction(i.urchinTracker))i.urchinTracker(b);
+else if(i.pageTracker!==h&&c.isFunction(i.pageTracker._trackPageview))i.pageTracker._trackPageview(b);else i._gaq!==h&&c.isFunction(i._gaq.push)&&i._gaq.push(["_trackPageview",decodeURI(b)])}},N=function(){var a=U()+":"+o+";document.open();document.writeln('<html><head><title>"+l.title.replace(/\'/g,"\\'")+"</title><script>var "+y+' = "'+encodeURIComponent(q()).replace(/\'/g,"\\'")+(l.domain!=n.hostname?'";document.domain="'+l.domain:"")+"\";<\/script></head></html>');document.close();";if(x<7)j.src=
+a;else j.contentWindow.location.replace(a)},Z=function(){if(E&&Y!=-1){var a,b,f=E.substr(Y+1).split("&");for(a=0;a<f.length;a++){b=f[a].split("=");if(/^(autoUpdate|history|strict|wrap)$/.test(b[0]))d[b[0]]=isNaN(b[1])?/^(true|yes)$/i.test(b[1]):parseInt(b[1],10)!==0;if(/^(state|tracker)$/.test(b[0]))d[b[0]]=b[1]}E=D}e=q()},aa=function(){if(!$){$=r;Z();c('a[rel*="address:"]').address();if(d.wrap){var a=c("body");c("body > *").wrapAll('<div style="padding:'+(t(a,"marginTop")+t(a,"paddingTop"))+"px "+
+(t(a,"marginRight")+t(a,"paddingRight"))+"px "+(t(a,"marginBottom")+t(a,"paddingBottom"))+"px "+(t(a,"marginLeft")+t(a,"paddingLeft"))+'px;" />').parent().wrap('<div id="'+y+'" style="height:100%;overflow:auto;position:relative;'+(K&&!window.statusbar.visible?"resize:both;":"")+'" />');c("html, body").css({height:"100%",margin:0,padding:0,overflow:"hidden"});K&&c('<style type="text/css" />').appendTo("head").text("#"+y+"::-webkit-resizer { background-color: #fff; }")}if(v&&!J){a=l.getElementsByTagName("frameset")[0];
+j=l.createElement((a?"":"i")+"frame");j.src=U()+":"+o;if(a){a.insertAdjacentElement("beforeEnd",j);a[a.cols?"cols":"rows"]+=",0";j.noResize=r;j.frameBorder=j.frameSpacing=0}else{j.style.display="none";j.style.width=j.style.height=0;j.tabIndex=-1;l.body.insertAdjacentElement("afterBegin",j)}u(function(){c(j).bind("load",function(){var b=j.contentWindow;e=b[y]!==h?b[y]:"";if(e!=q()){B(o);n.hash=e}});j.contentWindow[y]===h&&N()},50)}u(function(){s("init");B(o)},1);if(!G())if(v&&x>7||!v&&J)if(i.addEventListener)i.addEventListener(F,
+C,o);else i.attachEvent&&i.attachEvent("on"+F,C);else fa(C,50);"state"in window.history&&c(window).trigger("popstate")}},ga=function(a){a=a.toLowerCase();a=/(chrome)[ \/]([\w.]+)/.exec(a)||/(webkit)[ \/]([\w.]+)/.exec(a)||/(opera)(?:.*version|)[ \/]([\w.]+)/.exec(a)||/(msie) ([\w.]+)/.exec(a)||a.indexOf("compatible")<0&&/(mozilla)(?:.*? rv:([\w.]+)|)/.exec(a)||[];return{browser:a[1]||"",version:a[2]||"0"}},h,D=null,y="jQueryAddress",F="hashchange",V="change",W="internalChange",X="externalChange",
+r=true,o=false,d={autoUpdate:r,history:r,strict:r,wrap:o},z=function(){var a={},b=ga(navigator.userAgent);if(b.browser){a[b.browser]=true;a.version=b.version}if(a.chrome)a.webkit=true;else if(a.webkit)a.safari=true;return a}(),x=parseFloat(z.version),K=z.webkit||z.safari,v=!c.support.opacity,i=function(){try{return top.document!==h&&top.document.title!==h?top:window}catch(a){return window}}(),l=i.document,A=i.history,n=i.location,fa=setInterval,u=setTimeout,S=/\/{2,9}/g;z=navigator.userAgent;var J=
+"on"+F in i,j,E=c("script:last").attr("src"),Y=E?E.indexOf("?"):-1,O=l.title,I=o,$=o,ba=r,L=o,e=q();if(v){x=parseFloat(z.substr(z.indexOf("MSIE")+4));if(l.documentMode&&l.documentMode!=x)x=l.documentMode!=8?7:8;var ca=l.onpropertychange;l.onpropertychange=function(){ca&&ca.call(l);if(l.title!=O&&l.title.indexOf("#"+q())!=-1)l.title=O}}if(A.navigationMode)A.navigationMode="compatible";if(document.readyState=="complete")var ha=setInterval(function(){if(c.address){aa();clearInterval(ha)}},50);else{Z();
+c(aa)}c(window).bind("popstate",function(){if(decodeURI(e)!=decodeURI(q())){e=q();B(o)}}).bind("unload",function(){if(i.removeEventListener)i.removeEventListener(F,C,o);else i.detachEvent&&i.detachEvent("on"+F,C)});return{bind:function(){return k.apply(this,g(arguments))},unbind:function(){return da.apply(this,g(arguments))},init:function(){return k.apply(this,["init"].concat(g(arguments)))},change:function(){return k.apply(this,[V].concat(g(arguments)))},internalChange:function(){return k.apply(this,
+[W].concat(g(arguments)))},externalChange:function(){return k.apply(this,[X].concat(g(arguments)))},baseURL:function(){var a=n.href;if(a.indexOf("#")!=-1)a=a.substr(0,a.indexOf("#"));if(/\/$/.test(a))a=a.substr(0,a.length-1);return a},autoUpdate:function(a){if(a!==h){d.autoUpdate=a;return this}return d.autoUpdate},history:function(a){if(a!==h){d.history=a;return this}return d.history},state:function(a){if(a!==h){d.state=a;var b=T();if(d.state!==h)if(A.pushState)b.substr(0,3)=="/#/"&&n.replace(d.state.replace(/^\/$/,
+"")+b.substr(2));else b!="/"&&b.replace(/^\/#/,"")!=H()&&u(function(){n.replace(d.state.replace(/^\/$/,"")+"/#"+b)},1);return this}return d.state},strict:function(a){if(a!==h){d.strict=a;return this}return d.strict},tracker:function(a){if(a!==h){d.tracker=a;return this}return d.tracker},wrap:function(a){if(a!==h){d.wrap=a;return this}return d.wrap},update:function(){L=r;this.value(e);L=o;return this},title:function(a){if(a!==h){u(function(){O=l.title=a;if(ba&&j&&j.contentWindow&&j.contentWindow.document){j.contentWindow.document.title=
+a;ba=o}},50);return this}return l.title},value:function(a){if(a!==h){a=M(a);if(a=="/")a="";if(e==a&&!L)return;e=a;if(d.autoUpdate||L){if(B(r))return this;if(G())A[d.history?"pushState":"replaceState"]({},"",d.state.replace(/\/$/,"")+(e===""?"/":e));else{I=r;if(K)if(d.history)n.hash="#"+e;else n.replace("#"+e);else if(e!=q())if(d.history)n.hash="#"+e;else n.replace("#"+e);v&&!J&&d.history&&u(N,50);if(K)u(function(){I=o},1);else I=o}}return this}return M(e)},path:function(a){if(a!==h){var b=this.queryString(),
+f=this.hash();this.value(a+(b?"?"+b:"")+(f?"#"+f:""));return this}return M(e).split("#")[0].split("?")[0]},pathNames:function(){var a=this.path(),b=a.replace(S,"/").split("/");if(a.substr(0,1)=="/"||a.length===0)b.splice(0,1);a.substr(a.length-1,1)=="/"&&b.splice(b.length-1,1);return b},queryString:function(a){if(a!==h){var b=this.hash();this.value(this.path()+(a?"?"+a:"")+(b?"#"+b:""));return this}a=e.split("?");return a.slice(1,a.length).join("?").split("#")[0]},parameter:function(a,b,f){var m,
+p;if(b!==h){var P=this.parameterNames();p=[];b=b===h||b===D?"":b.toString();for(m=0;m<P.length;m++){var Q=P[m],w=this.parameter(Q);if(typeof w=="string")w=[w];if(Q==a)w=b===D||b===""?[]:f?w.concat([b]):[b];for(var R=0;R<w.length;R++)p.push(Q+"="+w[R])}c.inArray(a,P)==-1&&b!==D&&b!==""&&p.push(a+"="+b);this.queryString(p.join("&"));return this}if(b=this.queryString()){f=[];p=b.split("&");for(m=0;m<p.length;m++){b=p[m].split("=");b[0]==a&&f.push(b.slice(1).join("="))}if(f.length!==0)return f.length!=
+1?f:f[0]}},parameterNames:function(){var a=this.queryString(),b=[];if(a&&a.indexOf("=")!=-1){a=a.split("&");for(var f=0;f<a.length;f++){var m=a[f].split("=")[0];c.inArray(m,b)==-1&&b.push(m)}}return b},hash:function(a){if(a!==h){this.value(e.split("#")[0]+(a?"#"+a:""));return this}a=e.split("#");return a.slice(1,a.length).join("#")}}}();c.fn.address=function(s){this.data("address")||this.on("click",function(g){if(g.shiftKey||g.ctrlKey||g.metaKey||g.which==2)return true;var k=g.currentTarget;if(c(k).is("a")){g.preventDefault();
+g=s?s.call(k):/address:/.test(c(k).attr("rel"))?c(k).attr("rel").split("address:")[1].split(" ")[0]:c.address.state()!==undefined&&!/^\/?$/.test(c.address.state())?c(k).attr("href").replace(new RegExp("^(.*"+c.address.state()+"|\\.)"),""):c(k).attr("href").replace(/^(#\!?|\.)/,"");c.address.value(g)}}).on("submit",function(g){var k=g.currentTarget;if(c(k).is("form")){g.preventDefault();g=c(k).attr("action");k=s?s.call(k):(g.indexOf("?")!=-1?g.replace(/&$/,""):g+"?")+c(k).serialize();c.address.value(k)}}).data("address",
+true);return this}})(jQuery);

public/assets/index/picture/js/jquery.fullscreen.js

@@ -0,0 +1,147 @@
+/**
+ * @name        jQuery FullScreen Plugin
+ * @author      Martin Angelov, Morten Sjøgren
+ * @version     1.2
+ * @url         http://tutorialzine.com/2012/02/enhance-your-website-fullscreen-api/
+ * @license     MIT License
+ */
+
+/*jshint browser: true, jquery: true */
+(function($){
+	"use strict";
+
+	// These helper functions available only to our plugin scope.
+	function supportFullScreen(){
+		var doc = document.documentElement;
+
+		return ('requestFullscreen' in doc) ||
+				('mozRequestFullScreen' in doc && document.mozFullScreenEnabled) ||
+				('webkitRequestFullScreen' in doc);
+	}
+
+	function requestFullScreen(elem){
+		if (elem.requestFullscreen) {
+			elem.requestFullscreen();
+		} else if (elem.mozRequestFullScreen) {
+			elem.mozRequestFullScreen();
+		} else if (elem.webkitRequestFullScreen) {
+			elem.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
+		}
+	}
+
+	function fullScreenStatus(){
+		return document.fullscreen ||
+				document.mozFullScreen ||
+				document.webkitIsFullScreen ||
+				false;
+	}
+
+	function cancelFullScreen(){
+		if (document.exitFullscreen) {
+			document.exitFullscreen();
+		} else if (document.mozCancelFullScreen) {
+			document.mozCancelFullScreen();
+		} else if (document.webkitCancelFullScreen) {
+			document.webkitCancelFullScreen();
+		}
+	}
+
+	function onFullScreenEvent(callback){
+		$(document).on("fullscreenchange mozfullscreenchange webkitfullscreenchange", function(){
+			// The full screen status is automatically
+			// passed to our callback as an argument.
+			callback(fullScreenStatus());
+		});
+	}
+
+	// Adding a new test to the jQuery support object
+	$.support.fullscreen = supportFullScreen();
+
+	// Creating the plugin
+	$.fn.fullScreen = function(props){
+		if(!$.support.fullscreen || this.length !== 1) {
+			// The plugin can be called only
+			// on one element at a time
+
+			return this;
+		}
+
+		if(fullScreenStatus()){
+			// if we are already in fullscreen, exit
+			cancelFullScreen();
+			return this;
+		}
+
+		// You can potentially pas two arguments a color
+		// for the background and a callback function
+
+		var options = $.extend({
+			'background'      : '#111',
+			'callback'        : $.noop( ),
+			'fullscreenClass' : 'fullScreen'
+		}, props),
+
+		elem = this,
+
+		// This temporary div is the element that is
+		// actually going to be enlarged in full screen
+
+		fs = $('<div>', {
+			'css' : {
+				'overflow-y' : 'auto',
+				'background' : options.background,
+				'width'      : '100%',
+				'height'     : '100%'
+			}
+		})
+			.insertBefore(elem)
+			.append(elem);
+
+		// You can use the .fullScreen class to
+		// apply styling to your element
+		elem.addClass( options.fullscreenClass );
+
+		// Inserting our element in the temporary
+		// div, after which we zoom it in fullscreen
+
+		requestFullScreen(fs.get(0));
+
+		fs.click(function(e){
+			if(e.target == this){
+				// If the black bar was clicked
+				cancelFullScreen();
+			}
+		});
+
+		elem.cancel = function(){
+			cancelFullScreen();
+			return elem;
+		};
+
+		onFullScreenEvent(function(fullScreen){
+			if(!fullScreen){
+				// We have exited full screen.
+			        // Detach event listener
+			        $(document).off( 'fullscreenchange mozfullscreenchange webkitfullscreenchange' );
+				// Remove the class and destroy
+				// the temporary div
+
+				elem.removeClass( options.fullscreenClass ).insertBefore(fs);
+				fs.remove();
+			}
+
+			// Calling the facultative user supplied callback
+			if(options.callback) {
+                            options.callback(fullScreen);
+                        }
+		});
+
+		return elem;
+	};
+
+	$.fn.cancelFullScreen = function( ) {
+			cancelFullScreen();
+
+			return this;
+	};
+}(jQuery));

resources/views/category/jianjie.blade.php

@@ -16,20 +16,22 @@
             <div class="col-xs-12 col-md-9">
                 <div class="levelRight">
                     <!-- start 研究所概况 -->
-                    <div class="briefSurvey briefMargin">
-                        <div class="briefTitle">
-                            <img src="/assets/index/images/briefIcon/briefTitle-1.png"/>
-                            <div class="briefTitle-name">{{ getOneArticleBYCate(1,'title') }}</div>
-                        </div>
+                    <div class="briefSurvey">
+                        <img class="briefSurvey-cont-img" src="{{ getOneArticleBYCate(1,'cover_url') }}"/>
                         <div class="briefSurvey-cont">
-                            <img class="briefSurvey-cont-img" src="{{ getOneArticleBYCate(1,'cover_url') }}"/>
+                            <div class="briefSurvey-cont-new">
+                                {{ getOneArticleBYCate(1,'title') }}
+                            </div>
                             <div class="briefSurvey-cont-text">
                                 {{ getOneArticleBYCate(1,'description') }}
                             </div>
+                            <div class="briefSurvey-more" data-href="{{  getOneArticleBYCate(1,'link')  }}">
+                                <span>更多院所简介 +</span>
+                            </div>
                         </div>
-                        <div class="briefSurvey-more" data-href="{{  getOneArticleBYCate(1,'link')  }}">
-                            <span>更多院所简介 +</span>
-                        </div>
+                    </div>
+                    <div class="baseMap">
+                        <img class="baseMap-img" src="/assets/index/images/stoneImg.jpg"/>
                     </div>
                     <!-- end 研究所概况 -->
 
@@ -42,7 +44,7 @@
                         <div class="row">
                             @if (getArticlesBYCate(10,6)->isNotEmpty())
                                 @foreach (getArticlesBYCate(10,6) as $info)
-                                    <div class="col-xs-12 col-md-12" data-href="{{ $info->link }}">
+                                    <div class="col-xs-12 col-md-12">
                                         <div class="briefList">
                                             <div class="ce-img briefList-img">
                                                 <!-- 图片为4:3 -->
@@ -89,7 +91,7 @@
 
                                 @if (getArticlesBYCate(12,6)->isNotEmpty())
                                     @foreach (getArticlesBYCate(12,6) as $info)
-                                        <div class="col-xs-12 col-md-4" data-href="{{ $info->link }}">
+                                        <div class="col-xs-12 col-md-4">
                                             <div class="briefResearch-label">
                                                 <div class="ce-img briefResearch-label-img">
                                                     <!-- 图片为5:3 -->
@@ -180,39 +182,43 @@
                         </div>
                         <div class="briefAlbum">
                             <div class="briefAlbum-title"><span>四十周年所庆纪念册</span></div>
-                            <div class="briefSwiper-back"
-                                 style="background-image: url(/assets/index/images/briefIcon/briefAlbum_back.jpg);">
-                                <div class="swiper-container briefSwiper">
-                                    <div class="swiper-wrapper">
-                                        @if (getAdvertsByCate(16,10)->isNotEmpty())
-                                            @foreach (getAdvertsByCate(16,10)->chunk(3) as $adverts)
-                                                <div class="swiper-slide">
-                                                    @foreach($adverts as $advert)
-                                                        <div class="col-xs-12 col-md-4">
-                                                            <div class="ce-img briefSwiper-img mian">
-                                                                <img class='js-lightBox'
-                                                                     data-title="{{ $advert->title }}"
-                                                                     data-group='group-1'
-                                                                     src="{{ $advert->cover_url }}"/>
-                                                                <div class="briefSwiper-cont">
-                                                                    <div class="ce-nowrap briefSwiper-cont-name">
-                                                                        {{ $advert->title }}
-                                                                    </div>
-                                                                    {{--                                                                    <div class="ce-nowrap briefSwiper-cont-more ">--}}
-                                                                    {{--                                                                        <span>查看详情</span>--}}
-                                                                    {{--                                                                    </div>--}}
-                                                                </div>
-                                                            </div>
-                                                        </div>
-                                                    @endforeach
-                                                </div>
-                                            @endforeach
-                                        @endif
-                                    </div>
-                                    <div class="swiper-button-next"></div>
-                                    <div class="swiper-button-prev"></div>
-                                </div>
+                            <div style="margin-top: 10px">
+                                <img src="/assets/index/picture/image/0.jpg"
+                                     data-href="{{ getOneCategory(16,'link') }}"/>
                             </div>
+                            {{--                            <div class="briefSwiper-back"--}}
+                            {{--                                 style="background-image: url(/assets/index/images/briefIcon/briefAlbum_back.jpg);">--}}
+                            {{--                                <div class="swiper-container briefSwiper">--}}
+                            {{--                                    <div class="swiper-wrapper">--}}
+                            {{--                                        @if (getAdvertsByCate(16,10)->isNotEmpty())--}}
+                            {{--                                            @foreach (getAdvertsByCate(16,10)->chunk(3) as $adverts)--}}
+                            {{--                                                <div class="swiper-slide">--}}
+                            {{--                                                    @foreach($adverts as $advert)--}}
+                            {{--                                                        <div class="col-xs-12 col-md-4">--}}
+                            {{--                                                            <div class="ce-img briefSwiper-img mian">--}}
+                            {{--                                                                <img class='js-lightBox'--}}
+                            {{--                                                                     data-title="{{ $advert->title }}"--}}
+                            {{--                                                                     data-group='group-1'--}}
+                            {{--                                                                     src="{{ $advert->cover_url }}"/>--}}
+                            {{--                                                                <div class="briefSwiper-cont">--}}
+                            {{--                                                                    <div class="ce-nowrap briefSwiper-cont-name">--}}
+                            {{--                                                                        {{ $advert->title }}--}}
+                            {{--                                                                    </div>--}}
+                            {{--                                                                    --}}{{--                                                                    <div class="ce-nowrap briefSwiper-cont-more ">--}}
+                            {{--                                                                    --}}{{--                                                                        <span>查看详情</span>--}}
+                            {{--                                                                    --}}{{--                                                                    </div>--}}
+                            {{--                                                                </div>--}}
+                            {{--                                                            </div>--}}
+                            {{--                                                        </div>--}}
+                            {{--                                                    @endforeach--}}
+                            {{--                                                </div>--}}
+                            {{--                                            @endforeach--}}
+                            {{--                                        @endif--}}
+                            {{--                                    </div>--}}
+                            {{--                                    <div class="swiper-button-next"></div>--}}
+                            {{--                                    <div class="swiper-button-prev"></div>--}}
+                            {{--                                </div>--}}
+                            {{--                            </div>--}}
                         </div>
                     </div>
                 </div>

resources/views/category/sqhg.blade.php

@@ -0,0 +1,44 @@
+@extends('layouts.app')
+
+@section('title', $parent->title)
+
+@section('content')
+    <!-- 面包屑导航 -->
+    @include('category.navigation')
+
+    <!-- 内容 -->
+    <div class="container">
+        <div class="row">
+            <!-- 左侧导航部分 -->
+        @include('category.left')
+        <!-- 右侧内容部分 -->
+            <div class="col-xs-12 col-md-9">
+                <div class="briefVideo">
+                    <div class="briefTitle">
+                        <img src="/assets/index/images/briefIcon/briefTitle-1.png"/>
+                        <div class="briefTitle-name">四十年所庆</div>
+                    </div>
+                    <div class="briefVideo-cont">
+                        <div class="briefVideo-tips">
+                            <span>四十周年所庆宣传片</span>
+                        </div>
+                        <div class="briefVideo-video">
+                            <video width="100%" height="100%" style="object-fit:fill" controls
+                                   src="{{ getVideoByCate(15,'link_url') }}"
+                                   poster="{{ getVideoByCate(15,'cover_url') }}"
+                            >
+                            </video>
+                        </div>
+                    </div>
+                </div>
+                <div class="briefAlbum">
+                    <div class="briefAlbum-title"><span>四十周年所庆纪念册</span></div>
+                    <div style="margin-top: 10px">
+                        <img src="/assets/index/picture/image/0.jpg" data-href="{{ getOneCategory(16,'link') }}"/>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+@endsection
+