Struts2如何达成页面分步骤滑动

发布时间：2021-11-19 18:07:37 所属栏目：教程来源：互联网

导读：Struts2如何实现页面分步骤滑动 1.在css文件中加入这两个元素： .fcwindow { width:990px; position:relative; min-height:400px; overflow-x:hidden } #fccontent { position:relative; width:3960px; overflow-x:hidden; } 2.在js文件中加入代码： fcnext

Struts2如何实现页面分步骤滑动

1.在css文件中加入这两个元素：

.fcwindow
{
width:990px;
position:relative;
min-height:400px;
overflow-x:hidden
}

#fccontent
{
position:relative;
width:3960px;
overflow-x:hidden;
}

2.在js文件中加入代码：

fcnext是下一步！

fcup是上一步！

然后fcpArray里面的函数，就是各个步骤触发的函数，自行填写即可。在测试阶段可以：

a = function(){
    alert("function a");
}
b = function(){
    alert("function b");
}
c = function(){
    alert("function c");
}

var fcprocess = 0;// 当前步骤
var fcmaxprocess = 4;// 最大步骤数
var baseMoveLength = 990;// 步骤移动距离
var moveSpeed = 1000;//
var fcpArray = new Array();// 步骤切换时，触发函数

//切换函数
fcpArray.push(a);
fcpArray.push(b);
fcpArray.push(c);

this.fcnext = function(index) {
var left = $("#fccontent").css("left");

var movedis = 0;
if (left == "auto") {
  movedis = -baseMoveLength;
} else {
  var l = left.length;
  var d = left.substr(0, l - 2);
  // alert(d+"-"+left);
  movedis = new Number(d);
  movedis -= baseMoveLength;
  // alert(moveid+"ds"+d);
}

$("#fccontent").animate({
  left : movedis
}, moveSpeed, function() {
  if (index >= 0) {
  fcpArray[index]();
  }

});
};
this.fcup = function(index) {
var movedis = 0;
var left = $("#fccontent").css("left");
if (left == "auto") {
  movedis = 0;
} else {
  var l = left.length;
  var d = left.substr(0, l - 2);
  movedis = new Number(d);
  movedis += baseMoveLength;

}

$("#fccontent").animate({
  left : movedis
}, moveSpeed, function() {
  if (index >= 0) {
  fcpArray[index]();
  }
});
};

（编辑：我爱故事小小网_铜陵站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!

电脑主机一亮一灭无法	电脑坏了该怎么修复？
分享xp系统硬盘安装版	电脑系统安装软件有什