《Layer彈窗增強版》

//無限彈窗
var offset = [10, 10], layerLoop = function(){
	//獲取隨機寬高，僅爲了區分層
	var area = [(100+Math.random()*800)+'px', (100+Math.random()*400)+'px'];
	
	//座標疊加，僅爲了區分層
	offset[0] += 15;
	offset[1] += 15;

	var index = $.layer({
		type:1,
		fix: false,
		area: area,
		moveOut: true,
		zIndex: layer.zIndex,
		shade: [0],
		title: '賢心出品',
		offset: [offset[0]+'px', offset[1]+'px'],
		//如下對html作轉義是爲了防止被代碼演示解析，實際應用時無需轉義
		page: {html: '<\a href="javascript:;" id="next" class="next">點擊繼續彈出窗口\<\/a>'}, 
		success: function(othis){
			var next = othis.find('#next'), tit = othis.find('.xubox_title');
			next.on('click', function(event){
				layerLoop();
			});
			
			//開啓點擊使當前窗口置頂功能
			layer.setTop(othis);
		}
	});
};
$('#test5').on('click', layerLoop);

//關閉全部層運行此方法便可
layer.closeAll = function(){
	var layerObj = $('.xubox_layer');
	$.each(layerObj, function(){
		var i = $(this).attr('times');
		layer.close(i);
	});
};			
//tab選項卡
var tabi;
$('#test4').on('click', function(){
	tabi = $.layer({
		type:1,
		border: [0],
		area: ['602px', 'auto'],
		title: false,
		shade : [0.7 , '#000' , true],
		move: ['.tabmove', true],
		closeBtn: false,
		page: {dom: '.tab'}
	});	
});

//切換事件
var btn = $('.tabtit').children(), main = $('.tab_main').children(), close = $('.tabclose');
btn.on('click', function(){
	var othis = $(this), index = othis.index();
	othis.addClass('tabnow').siblings().removeClass('tabnow');
	main.eq(index).show().siblings().hide();
});
//關閉層
close.on('click', function(){
	layer.close(tabi);
});	

//頁面嚮導
$('#test1').on('click', function(){
	var pagei = $.layer({
		type:1,
		border: [0], //不顯示邊框
		area: ['800px', 'auto'],
		title: false,
		shade: [0.7,'#000',true],
		offset: ['10px', '50%'],
		bgcolor: '',
		closeBtn: false,
		page:{html: '<\div class="diybox"><\span title="關閉" id="pageclose">\<\/span>\<\/div>'},  //此處對html作轉義是爲了防止被代碼演示解析，實際應用時無需轉義
		success: function(){
			var page = $('#pageclose');
			page.on('click', function(){
				layer.close(pagei);
			});
		}
	});
});			
//拖動模塊
$('#test3').on('click', function(){
	$.layer({
		type:1,
		border: [0],
		area: ['120px', '100px'],
		title: false,
		shade: [0],
		move: ['.pagekuai', true],
        moveType: 1,
		closeBtn: false,
		page: {dom: '.pagekuai'}
	});
});