2015-03-18 9 views
0

Я загрузил шаблон начальной загрузки, и это код для фильтрации. Я не понимаю комментарий относительно того же TAG к классу элементов портфеля. Я не вижу, где бы я это добавил?Bootstrap data-filter и class item class

<!-- CONTENT CONTAINER--> 
    <div class="container"> 
      <!-- FILTER--> 
     <!-- just add your TAG to data-filter="ADD HERE" -->  
     <!-- and then add your same TAG to portfolio item class="ADD HERE" -  -> 
     <div class="row"> 
      <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12"> 
       <div class="panel panel-default text-center"> 
        <div class="panel-body"> 
         <div class="proj"> 
          <div id="filters"> 
          <a href="#" data-filter="*" class=" active btn btn-danger">Show All</a> 
          <a href="#" data-filter=".graphics" class="btn btn-danger">Graphics</a> 
          <a href="#" data-filter=".web" class="btn btn-danger">Web</a> 
          <a href="#" data-filter=".ui" class="btn btn-danger">UI</a> 
          <a href="#" data-filter=".design" class="btn btn-danger">Design</a> 
          </div> 
         </div> 
        </div> 
       </div> 
      </div> 
     </div> 

    <!--END: FILTER--> 


<!--###################--> 
<!-- START PORTFOLIO --> 
<!--###################--> 
<div id="container-folio" style="position:relative"> 

<!-- portfolio item --> 
<div class="box col-xs-6 col-md-4 col-sm-6 col-lg-3 graphics design"> 
    <!-- START WRAPPER IMG THUMBNAIL--> 
    <div class="thumbnail"> 
      <!-- NAV LINKS --> 
      <div class="plus"> 
        <a href="#" title="read more" class="btn btn-lg btn- info"><i class="icon-link"></i></a> 
        <a href="#" title="enlarge" class="btn btn-lg btn- primary"><i class="icon-eye-open"></i></a> 
      </div> 
      <!-- /NAV LINKS --> 
     <!--/IMAGE--> 
     <img class="img-responsive" src="http://lorempixel.com/560/420/fashion/10" alt=""> 
     <!--/IMAGE--> 

ответ

0

Я использовал этот шаблон в своем проекте работы. Вот объяснение: привязывается фильтр ссылки на каждый элементов, связанных через данные фильтра

data-filter=".graphics" 

В то время как вы связать каждый элемент в его связи фильтра, добавив имя класса сетки колонки DIV:

отл. Этот предмет является предметом графических и проектных фильтров

<div class="box col-xs-6 col-md-4 col-sm-6 col-lg-3 graphics design">