- klarabara
- Medlem ●
- Stockholm
- 2013-01-18 12:53
Jag har nu försökt i två dar med det här problemet utan att komma någonvart. Jag har använt mig av isotope på min kommande portfolio tillsammans med filtering och allt har fungerat bra. Filtreringen fungerar och animeringen mellan filtrerings-lägena fungerar som man kan se i den här demon. Filtering · Isotope Demo
Det som inte fungerar är när man ändrar storleken på fönstret. Jag har försökt byta ut till orginalkod från olika sidor men det gör ingen skillnad.
Jag får det här felmeddelandet:
TypeError: 'undefined' is not an object (evaluating 'jQuery.event.handle.apply')
som uppstår på rad 302 i isotope.js, en fil som jag inte en öppnat bara lagt in.
Stycket heter smartresize.
// ========================= smartresize =============================== /* * smartresize: debounced resize event for jQuery * * latest version and complete README available on Github: * https://github.com/louisremi/jquery.smartresi... * * Copyright 2011 @louis_remi * Licensed under the MIT license. */ var $event = $.event, resizeTimeout; $event.special.smartresize = { setup: function() { $(this).bind( "resize", $event.special.smartresize.handler ); }, teardown: function() { $(this).unbind( "resize", $event.special.smartresize.handler ); }, handler: function( event, execAsap ) { // Save the context var context = this, args = arguments; // set correct event type event.type = "smartresize"; if ( resizeTimeout ) { clearTimeout( resizeTimeout ); } resizeTimeout = setTimeout(function() { jQuery.event.handle.apply( context, args );//<<<<<<<<< Här uppstår felet. }, execAsap === "execAsap"? 0 : 100 ); } }; $.fn.smartresize = function( fn ) { return fn ? this.bind( "smartresize", fn ) : this.trigger( "smartresize", ["execAsap"] ); };
Det här min kod som jag gissar att det istället kommer ifrån, eftersom det är här jag använder isotope:
$(document).ready(function(){ //variabler var $content = $('#content'); var $container = $('#container'); var toFilter = '*'; //om content-diven syns så ska datacurrent istället komma från content-divens attribut. if($content.is(":visible")){ $container.isotope({itemSelector : '.element'}); $(function(){ var contentCat=$content.attr('data-current'); $('#container').attr('data-current',contentCat);//stoppar in värdet i containerns 'data-current' var currentCat=$content.attr('data-current');//nu ser man i menyn vad det är som är current. return false; }); } $container.isotope({ itemSelector : '.element',//det här är elementen det gäller filter: toFilter, //här är variabeln för filtreringen animationOptions: { duration: 750, easing: 'linear', queue: false} }); $container.attr('data-current',toFilter); checkActive(); $('#filters a').click(function(){ var title = $(this).attr('data-filter');//hämtar det som ska stå i data-current var text = $(this).text(); console.log(text); if(text == "Allt"){ var selector = title;//om stjärna där så blir det ist. "Allt". }else{ var selector = title; } if(text=="Om mig"){ var url= "http://enAnnanUrl.se"; $(this).attr('href', url); return true; }else if(text=="Blogg"){//ett försökt till att få den att visa bara fem inlägg på allt och alla när man filtrerar på blogg. var bloggItems = $('.blogg').length; if(bloggItems >5){ //hämta resten } } $container.attr('data-current',selector);//vi stoppar in datafilter(med punkt) i data-current $container.isotope({ //lite options filter: selector, animationOptions: {duration: 750, easing: 'linear', queue: false} }); checkActive(); return false; }); function checkActive(){ $('#filters a').each(function(){ $(this).css({color:'#232323'} ); var title = $(this).attr('data-filter');//vi hämtar från menyns filter-fält, inte title var currentCat = $container.attr('data-current'); if ($content.is(":visible")){ var currentCat=$content.attr('data-current'); var currentCat='.'+currentCat; var selector = $content.attr('data-current'); } if(title==currentCat){ $(this).css({color: '#00ff00'}); } });//.each finished }//checkActive-function finished });//document.ready() finished..
Jag använder lite med isotope här också, men även lazy-load har ju slutat fungera, så det kanske är här problemet är?
//lazyload jQuery(document).ready(function ($) { var $imgs = ('img.lazy'), $container = $('#container'), $window = $(window); $("img.lazy").show().lazyload(); $("img.lazy").lazyload({ 'failure_limit' : Math.max($imgs.length - 1, 0), effect:"fadeIn" }); $('#filters li a').click(function () { $container.isotope({ // layoutMode: 'masonry', onLayout: function () { $window.trigger("scroll"); } }); }); });
Mycket kod, sorry. Men jag vet varken ut eller in längre. Ytterst tacksam för hjälp!