Ich arbeite derzeit an einer Seite, auf der später nicht nur farbige Kästen, sondern wirkliche Bilder zu sehen sein sollen. Außerdem sollen diese Bilder nach den Ordnern in denen sie liegen sortiert werden, da diese verschiedene Kategorien darstellen. Für jede Kategorie wird ein Button dynamisch eingefügt und soll beim Klick alle Elemente unsichtbar machen, die nicht diese Kategorie haben. Dies funktioniert auch beim ersten Button sehr gut, beim zweiten hingegen nicht so sehr. Doch seht selbst:
Galerie - Johann Miedl - Fotografie
Der relevante Part des Javascript ist wohl:
Quellcode
- $(document).ready(function(){
- var $container = $('.ce_gallery ul');
- var unhidden = true;
- $('.ce_gallery ul li a').each(function(){
- var path = $(this).attr("href");
- var arr = path.split('/');
- var cat = arr[3]; //cat = "Landschaften" oder so
- $(this).parent().parent().addClass(cat);
- if($("#categories button#" + cat).length == 0){
- $("#categories").append('<button id="'+cat+'"> '+cat+'</button>');
- }
- });
- $container.masonry({
- itemSelector : 'li',
- isFitWidth: true,
- isAnimated: true
- });
- $('#categories button').click(function(){
- var ths = $(this);
- var cat = $(this).attr('id');
- if(ths.hasClass('active')){
- $('.ce_gallery ul li').show();
- $('.ce_gallery ul li a').addClass('cboxElement');
- ths.removeClass('active');
- }else{
- //show all
- $('#categories button.active').removeClass("active");
- $('.ce_gallery ul li').show();
- //Hide all with category cat
- $('.ce_gallery ul li').each(function(){
- if( !$(this).hasClass(cat)){
- $(this).find('a').removeClass('cboxElement');
- $(this).hide();
- }
- });
- ths.addClass('active');
- }
- $container.masonry();
- return false;
- });
- });
Masonry ermöglicht die automatische Anordnung der Elemente.
Ich danke schonmal im Vorraus
Taxel
Cuiusvis hominis est errare, nullius nisi insipientis in errore perseverare.
Irren ist menschlich, doch im Irrtum zu verharren ist ein Zeichen von Dummheit.
-Cicero
Irren ist menschlich, doch im Irrtum zu verharren ist ein Zeichen von Dummheit.
-Cicero