Erro Filtro Isotopo
Olá pessoal estou com um erro que presumo que seja bobo na tentativa de usar o Isotope filter, segue abaixo partes do código:
<!! -------------------HEAD---------------------- !!>
<head>
<meta charset='UTF-8'>
<script src="js/bootstrap.js"></script>
<script src="[https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js">](https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js)
<script src="js/isotope.js"></script>
</head>
<!! -------------------/HEAD---------------------- !!>
<!! -------------------JAVA SCRIPT---------------------- !!>
$( document ).ready(function() {
/* activate jquery isotope */
var $container = $('#posts').isotope({
itemSelector : '.item',
isFitWidth: true
});
$(window).smartresize(function(){
$container.isotope({
columnWidth: '.col-md-2'
});
});
$container.isotope({ filter: '*' });
// filter items on button click
$('#filters').on( 'click', 'button', function() {
alert("I am an alert box!");
var filterValue = $(this).attr('data-filter');
$container.isotope({ filter: filterValue });
});
});
<!! -------------------/JAVA SCRIPT---------------------- !!>
<!! -------------------Filtros---------------------- !!>
<div class='col-md-12'>
<div id="filters" class="button-group">
<button id='filters' class="btn btn-default" data-filter="*">Mostrar tudo</button>
<button id='filters' class="btn btn-default" data-filter=".videos">Vídeos</button>
<button id='filters 'class="btn btn-default" data-filter=".fotos">Fotos</button>
</div>
</div>
<!! -------------------/Filtros---------------------- !!>
<!! -------------------OBJETOS A SEREM FILTRADOS---------------------- !!>
<div class='row' id='posts'>
<?php
$consulta = $pdo->query("SELECT * FROM arquivos");
$id = 1;
while ($linha = $consulta->fetch(PDO::FETCH_OBJ)) {
$nome = $linha -> nome;
$url = $linha -> url;
$codigo = $linha -> codigo;
$tipo = $linha -> tipo;
$data = $linha -> data;
if ($tipo=='Foto') {
?>
<div class='item fotos col-md-2' id='<?php echo $id ?>'>
<div class='thumbnail' >
<h3> <?php echo $nome ?> </h3>
<div style='background-color:757575'><center> <img src='fotos/<?php echo $url ?>' class='img-responsive' style='max-height:250px'> </center> </div>
<i><?php echo $data ?> </i>
</div>
</div>
<?php
}
if ($tipo=='Video'){
?>
<div class='item videos col-md-2' id='<?php echo $id ?>'>
<div class='thumbnail' >
<h3> <?php echo $nome ?> </h3>
<hr>
<div class="embed-responsive embed-responsive-16by9" >
<video controls name='media' style='max-height:150px'>
<source src="videos/<?php echo $url; ?>" style='max-height:130px'></source>
</video>
</div><i><?php echo $data ?> </i>
</div>
</div>
<?php
}
$id = $id+1;
}
?>
</div>
<!! -------------------/OBJETOS A SEREM FILTRADOS---------------------- !!>
Discussão (0)
Carregando comentários...