Jquery - Identische Buttons verhalten sich unterschiedlich?

  • geschlossen
  • JavaScript

  • Taxel
  • 4699 Aufrufe 0 Antworten

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • Jquery - Identische Buttons verhalten sich unterschiedlich?

    Hi Leute,
    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

    1. $(document).ready(function(){
    2. var $container = $('.ce_gallery ul');
    3. var unhidden = true;
    6. $('.ce_gallery ul li a').each(function(){
    7. var path = $(this).attr("href");
    8. var arr = path.split('/');
    9. var cat = arr[3]; //cat = "Landschaften" oder so
    10. $(this).parent().parent().addClass(cat);
    11. if($("#categories button#" + cat).length == 0){
    12. $("#categories").append('<button id="'+cat+'"> '+cat+'</button>');
    13. }
    15. });
    16. $container.masonry({
    17. itemSelector : 'li',
    18. isFitWidth: true,
    19. isAnimated: true
    20. });
    21. $('#categories button').click(function(){
    23. var ths = $(this);
    24. var cat = $(this).attr('id');
    25. if(ths.hasClass('active')){
    27. $('.ce_gallery ul li').show();
    28. $('.ce_gallery ul li a').addClass('cboxElement');
    29. ths.removeClass('active');
    30. }else{
    31. //show all
    32. $('#categories button.active').removeClass("active");
    33. $('.ce_gallery ul li').show();
    34. //Hide all with category cat
    35. $('.ce_gallery ul li').each(function(){
    36. if( !$(this).hasClass(cat)){
    37. $(this).find('a').removeClass('cboxElement');
    38. $(this).hide();
    39. }
    40. });
    44. ths.addClass('active');
    45. }
    46. $container.masonry();
    48. return false;
    49. });
    51. });
    Alles anzeigen


    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