2011-06-28 37 views
1

我寫了一個使用CSS轉換的圖片庫。如果CSS轉換不能用於modernizr插件,它默認爲淡入淡出效果。這種效果根本不起作用。任何人都可以看到代碼的問題。 CSS3版本功能齊全。JQuery淡入淡出備份到CSS轉換 - Modernizr

編輯

我把它翻拍到addClass與removeClass類似於網絡套件是如何工作的。 JQuery函數現在可以在沒有控制檯錯誤的情況下運行。但它並不特別流暢。如果用戶點擊多個縮略圖,使用CSS-3進行轉換,即使它們在效果中途過渡,圖像也會輕柔轉換。 JQuery接縫堵塞然後開始跳躍。

對此的任何想法。

var timerp = null; 
     var nextslide; 


     if(!Modernizr.csstransitions) { 
      $('.thumbs').click(function() { 
     if (timerp) { 
      window.clearInterval(timerp); 
     } 
     $('.cornerimgfocus').removeClass('cornerimgfocus',{queue:true,duration:2000}); 
     $('#P' + $(this).attr('id')).addClass('cornerimgfocus',{queue:true,duration:2000}); 
     gallery(); 
    }); 
     function gallery() { 
      timerp = window.setInterval(function() { 
       var islide = $('.cornerimgfocus'); 
       islide.removeClass('cornerimgfocus',{queue:true,duration:2000}); 

       if (islide[0] == $('.cornerimg:last')[0]) { 
        nextslide = $('.cornerimg').first(); 
       } else { 
        nextslide = islide.next(); 
       }; 
       nextslide.addClass('cornerimgfocus',{queue:true,duration:2000}); 
      }, 6000); 
     } 
} 
     else { 
     $('.thumbs').click(function() { 
     if (timerp) { 
      window.clearInterval(timerp); 
     } 
     $('.cornerimgfocus').removeClass('cornerimgfocus'); 
     $('#P' + $(this).attr('id')).addClass('cornerimgfocus'); 
     gallery(); 
    }); 

     function gallery() { 
      timerp = window.setInterval(function() { 
       var islide = $('.cornerimgfocus'); 
       islide.removeClass('cornerimgfocus'); 

       if (islide[0] == $('.cornerimg:last')[0]) { 
        nextslide = $('.cornerimg').first(); 
       } else { 
        nextslide = islide.next(); 
       }; 
       nextslide.addClass('cornerimgfocus'); 
      }, 6000); 
     } 
} 
+1

_ 「這不算什麼工作」 _ **需要更多的細節。**在控制檯中的任何錯誤?嘗試運行代碼時,惡魔是否會從您的eSATA端口飛出? –

+0

更新問題 –

回答