mozna tyto 2 jQuery pluginy znate a mozna mi i poradite jak je propijit.
Potreboval bych aby se na zacatku nacetla galerie "Grid-A-Licious". Po zmacknuti tlacitka ve filtru "MixItUp" potrebuju aby se galerie "Grid-A-Licious" zrusila a nacetla se znovu jen s temi vyfiltrovanymi obrazky. Je neco takoveho vubec mozne? Dival jsem se do dokumentace toho "Grid-A-Licious" ale nic jako "Destroy" jsem tam nenasel. Poradi mi nekdo jak na to?
Kód: Vybrať všetko
<script type="text/javascript">
$(document).ready(function(){
function grid() {
$("#gal").gridalicious({
width: 300,
gutter: 10,
animate: false
});
}
$('#gal').mixItUp({
callbacks: {
onMixStart: function(){
},
onMixEnd: function(){
}
}
});
});
</script>
Kód: Vybrať všetko
<div class="filters">
<div class="filter" data-filter="all">Show All</div>
<div class="filter" data-filter=".2015">2015</div>
<div class="filter" data-filter=".2014">2014</div>
<div class="filter" data-filter=".2013">2013</div>
</div>
<div id="gal">
<div class="item mix all 2013">
<a href=""><img src="/design/img/1.jpg" alt="" /></a>
</div>
<div class="item mix all 2013">
<a href=""><img src="/design/img/2.jpg" alt="" /></a>
</div>
<div class="item mix all 2015">
<a href=""><img src="/design/img/3.jpg" alt="" /></a>
</div>
<div class="item mix all 2013">
<a href=""><img src="/design/img/4.jpg" alt="" /></a>
</div>
<div class="item mix all 2013">
<a href=""><img src="/design/img/5.jpg" alt="" /></a>
</div>
<div class="item mix all 2015">
<a href=""><img src="/design/img/6.jpg" alt="" /></a>
</div>
<div class="item mix all 2015">
<a href=""><img src="/design/img/5.jpg" alt="" /></a>
</div>
<div class="item mix all 2013">
<a href=""><img src="/design/img/1.jpg" alt="" /></a>
</div>
<div class="item mix all 2015">
<a href=""><img src="/design/img/6.jpg" alt="" /></a>
</div>
</div>
Tak nakonec bez pouziti MixItUp
Kód: Vybrať všetko
<script type="text/javascript">
$(document).ready(function () {
grid();
});
function grid() {
$("#gal").gridalicious({
width: 300,
gutter: 10,
animate: true
});
}
function myshow(rok) {
$("#gal_content").load("reference.php #gal", function() {
$("#gal div").hide();
$("#gal div").not("."+rok).remove();
$("#gal div").show();
grid();
});
return false;
}
function myshowall() {
$("#gal_content").load("reference.php #gal", function() {
grid();
});
return false;
}
</script>
Kód: Vybrať všetko
<div class="filters">
<a onclick="myshowall();">Show All</a>
<a onclick="myshow(2013);">2013</a>
<a onclick="myshow(2014);">2014</a>
<a onclick="myshow(2015);">2015</a>
</div>