各位好
目前我要製作一個使用360張圖片的連續動畫
因客戶的需求
目前我想的方法是
(ps :#main_arrow_L #main_arrow_R 為按鈕元件,是利用程式去按擊它後進行圖片播放)
var divNum = 0;
function changeDivC( no ){
if(notWin){
$("#ser03 div").eq(no).show();
}else{
$("#ser03 div").eq(no).hide().fadeIn(1000);
}
}
var c = ($("#ser03 div").length);
$("#ser03 #main_arrow_L").click(function(){
$("#ser03 div").eq(divNum).stop().fadeOut(500, function(){ if(divNum==0){ divNum = c-1 }else{ divNum--; } changeDivC( divNum ) });
});
$("#ser03 #main_arrow_R").click(function(){
$("#ser03 div").eq(divNum).stop().fadeOut(500, function(){ if(divNum>= c-1 ){ divNum = 0 }else{ divNum++; } changeDivC( divNum ) });
});
/*===============================================================================

圖片輪播code ↓

===============================================================================*/
$(document).ready(init);
var mouse;
function init() {
$("#ser03 div").mouseenter(MouseEnterHandler);
$("#ser03 div").mouseleave(MouseLeaveHandler);
mouse=setTimeout(myFunc, 10000); //初始畫面載入後,2秒後執行myFunc()
}

function myFunc() {
// 換片格式 ↓
$("#ser03 #main_arrow_R").click(function(){
$("#ser03 div").eq(divNum).stop().fadeOut(500, function(){ if(divNum>= c-1 ){ divNum = 0 }else{ divNum++; } changeDivC( divNum ) });

mouse=setTimeout(myFunc, 10000); //每2秒鐘執行myFunc()
}
/*===============================================================================

圖片輪播code ↑

===============================================================================*/

不知 大家是否有更好的方法呢?
你把那360張圖做成GIF檔應該會比較方便吧!?
因為 這是前導動畫 大小是 1920*1080的,我嘗試過了 會整個當掉 = =|| 所以我才想來使用jq

文章分享
評分
評分
複製連結

今日熱門文章 網友點擊推薦!