(function(jQuery){ /** * Date: 2012/01/22 * * @projectDescription 仿照微薄滾動效果 * * @author Joe nikejaycn#gmail.com * @version v0.1 */ jQuery.fn.iscroll = function(params){ options = { ShowTime: 500, //顯示時間 moveTime: 3000, //移動時間 charElement:"li", //子節點 ajaxTrunOn: false, //是否開啟ajax請求,定時擷取資料 ajaxTime: 30000, //發出一次ajax請求時間,預設是30秒擷取一次資料 ajaxUrl: "", //ajax資料請求路徑 setAjaxHtml: function(data){ //資料來源輸出設定 //data是ajax返回資料 //在這裡都其進行格式化輸出 } }; jQuery.extend(options, params); //儲存當前對象 var _this = this, isIE = !!window.ActiveXObject, isIE6 = isIE&&!window.XMLHttpRequest, jsonData = false, jsonCount = -1; //滑鼠經過設定name值為"hovered" function setHover(){ _this.hover(function(){ _this.attr("name","hovered"); },function(){ _this.removeAttr("name"); }); }setHover(); function animateHandler(){ if(options.ajaxTrunOn){ //處理請求資料 handlerJson(); } var height = _this.find(".itemt:last").height(); _this.find(".itemt:last").css({"opacity":0,"height":0}); _this.find(".itemt:first").before( _this.find(".itemt:last") ); _this.find(".itemt:first").animate({"height":height},options.ShowTime); _this.find(".itemt:first").animate({"opacity":"1"},options.ShowTime); } function setMove(){ if(_this.attr("name") != "hovered"){ animateHandler(); } } //設定定時滾動 setInterval(function(){ jsonCount++; setMove(); },options.moveTime); //定時查詢一次資料 if(options.ajaxTrunOn){ setInterval(function(){ getNewsList(); },options.ajaxTime); } //ajax請求 function getNewsList(){ $.ajax({ url: options.ajaxUrl, dataTypes: "json", success: function(json){ jsonCount = -1; jsonData = json; } }) } //處理請求回來的json function handlerJson(){ if(jsonData){ _jsonData = eval( "(" +jsonData + ")"); var _length = _jsonData.length; if(jsonCount < _length){ //處理相應的函數 _this.find(".itemt:last").css("height","auto");//清除高度 _this.find(".itemt:last").html(options.setAjaxHtml(_jsonData[jsonCount])); } } } } })(jQuery); |