jQuery Transit函數完成

我已經創建了這兩個函數使用jquery轉移，當用戶按下右側或左側按鈕時，這些函數被設計爲在新頁面中滑動到頁面上。他們在一些時間工作。其他時間的內容將加載，然後不取消隱藏自己。所以它會被加載，你可以用chrome檢查它，看到顯示仍然被設置爲none。其他時間沒有問題，它的工作原理與預期完全相同。頁面上沒有錯誤。真的，頁面上唯一的JavaScript是這個函數的幾個不同版本，它們都會加載不同的頁面並以某種形式或形式滾動頁面。jQuery Transit函數完成

我的問題是：我使用該功能從jquery Transit正確完成？我的功能是否按照預期工作，或者我錯過了一些很大的東西，但沒有正確設置。

function ShowPartTiles_FromLeft() { 
    $("#SeriesPartBrand").transition({ 
     opacity: 0, 
     x: "1000px" 
    }, 500, "out", function() { 
     $("#SeriesPartBrand").transition({ 
      opacity: 0, 
      x: "-1000px" 
     }, 0, "out") 
    }), $("#SeriesPartBrand").load("<?php echo uri_string() ?>/part", function() { 
     $("#SeriesPartBrand").transition({ 
      opacity: 1, 
      x: "0" 
     }, 500, "in") 
    }) 
} 

function ShowPartTiles_FromRight() { 
    $("#SeriesPartBrand").transition({ 
     opacity: 0, 
     x: "-1000px" 
    }, 500, "out", function() { 
     $("#SeriesPartBrand").transition({ 
      opacity: 0, 
      x: "1000px" 
     }, 0, "out") 
    }), $("#SeriesPartBrand").load("<?php echo uri_string() ?>/part", function() { 
     $("#SeriesPartBrand").transition({ 
      opacity: 1, 
      x: "0" 
     }, 500, "in") 
    }) 
}

來源

2014-09-11 John Ayers

jQuery中沒有過渡函數，有一個動畫。但我會建議使用CSS3過渡性質：

#SeriesPartBrand { 
    transition: all 0.5s; 
} 

function ShowPartTiles_FromLeft() { 
    $("#SeriesPartBrand").css({opacity: 0, left: 1000}); 
    $("#SeriesPartBrand").off('transitionend').on('transitionend', function() { 
     $("#SeriesPartBrand").css({opacity: 0, left: -1000}); 
     $("#SeriesPartBrand").load("<?php echo uri_string() ?>/part", function() { 
      $("#SeriesPartBrand").css({opacity: 0, left: 0}); 
     }); 
    }); 
}

這應該讓你開始。也不要用第一個大寫字母來命名你的JS函數，不要這個名字看起來更像這樣：「showPartTilesFromLeft（）」。

並且html id和類必須全部小寫，並用逗號「 - 」分隔單詞。

來源

2014-09-11 14:05:01 Teo

jQuery Transit函數完成

回答

相關問題