brand intro

@@ -7,6 +7,10 @@
 var $ = require('yoho.zepto'),
     lazyLoad = require('yoho.zeptolazyload');
 
+//品牌页参数
+var $brandHeader = $('#brand-header'),
+    $introBox = $('#intro-box');
+
 var filter = require('../plugin/filter');
 
 var $goodsContainer = $('#goods-container'),
@@ -276,4 +280,22 @@ $(window).scroll(function() {
         $(document).height() - 0.25 * $goodsContainer.height()) {
         search();
     }
+});
+
+//品牌介绍
+$brandHeader.children('.btn-intro').bind('touchstart', function() {
+    $introBox.removeClass('hide');
+});
+
+$('.close-intro, .brand-intro-box').click(function() {
+    $introBox.addClass('hide');
+});
+
+$('#brand-intro').click(function(e) {
+    e.stopPropagation();
+});
+
+//品牌收藏
+$brandHeader.children('.btn-col').bind('touchstart', function() {
+    $(this).toggleClass('coled');
 });
\ No newline at end of file

@@ -96,10 +96,59 @@
 
     .btn-col {
         right: 15px;
+
+        .iconfont {
+            font-size: 12px;
+        }
     }
 
     .brand-intro-box {
-        display: none;
+        position: absolute;
+        top: 0;
+        left: 0;
+        right: 0;
+        bottom: 0;
+        background: rgba(0,0,0,.3);
+        padding: 44px 0;
+        z-index: 1;
+        overflow: auto;
+
+        .brand-intro {
+            position: relative;
+            box-sizing: border-box;
+            width: 85%;
+            margin: 0 7.5%;
+            background: #fff;
+            padding: 10px 8%;
+        }
+
+        h2 {
+            text-align: center;
+            font-size: 17px;
+            line-height: 40px;
+        }
+
+        .con {
+            font-size: 12px;
+            line-height: 16px;
+            padding: 20px 0;
+            border-top: 1px solid #e6e6e6;
+            border-bottom: 1px solid #e6e6e6;
+            overflow-x: hidden;
+        }
+
+        .fo {
+            font-size: 18px;
+            height: 40px;
+            line-height: 40px;
+            text-align: center;
+        }
+
+        .close-intro {
+            position: absolute;
+            top: 6px;
+            right: 6px;
+        }
     }
 
     .list-nav {

@@ -24,7 +24,7 @@
         {{/ brandWay}}
 
         {{# brand}}
-            <div class="brand-header" data-id={{id}}>
+            <div id="brand-header" class="brand-header" data-id={{id}}>
                 <img class="lazy" data-original={{banner}}>
                 <a class="btn-intro" href="javascript:void(0);">
                     品牌介绍
@@ -34,8 +34,18 @@
                     收藏
                 </a>
             </div>
-            <div class="brand-intro-box">
-                <div id="brand-intro" class="brand-intro">{{intro}}</div>
+            <div id="intro-box" class="brand-intro-box hide">
+                <div id="brand-intro" class="brand-intro">
+                    <h2>品牌介绍</h2>
+                    <div class="con">
+                        {{{intro}}}
+                    </div>
+                    <p class="fo">
+                        <span></span>
+                        100%品牌授权正品
+                    </p>
+                    <span class="iconfont close-intro">&#xe623;</span>
+                </div>
             </div>
         {{/ brand}}
 

@@ -19,6 +19,10 @@ class ListController extends AbstractAction
                     'name' => 'Aape',
                     'thumb' => 'http://img13.static.yhbimg.com/brandLogo/2015/08/26/15/02261f64c198cb4b181c5ef9e61f38f4b9.jpg?imageMogr2/thumbnail/150x70/extent/150x70/background/d2hpdGU=/position/center/quality/90'
                 ),
+                'brand' => array(
+                    'id' => 1,
+                    'banner' => 'http://img10.static.yhbimg.com/brandBanner/2015/08/26/07/015af5d6ee626cb132cd9c436e896fae26.jpg?imageMogr2/crop/640x'
+                ),
                 'new' => array(
                     array(
                         'id' => 1,