1. 爱易网页
  2. Java教程
  3. 头疼了，一个ie兼容性 的有关问题

头疼了，一个ie兼容性 的有关问题

日期：2014-05-17　 浏览次数：20796 次

头疼了，请教各位一个ie兼容性 的问题
JSP：
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<script type="text/javascript" src="jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="imgJSP.js"></script>

<title>123</title>

<link href="imgJSP.css" rel="stylesheet" type="text/css">

</head>

<body>

  <div id="imgDiv"><img id="imgImg"/></div>
  <div id="tipDiv"></div>

</body>
</html>

imgJSP.css：
#imgDiv {
position:absolute;
width:550px;
height:400px;
z-index:1;
border-width: 1px;
border-style: solid;
border-color: #0CF;
top:0px;
left:0px;
}
#tipDiv {
position:absolute;
width:550px;
height:20px;
z-index:1;
top: 400px;
left:0px;
border-width: 1px;
border-style: solid;
border-color: #0CF;
}
#imgImg {
position:absolute;
width:550px;
height:400px;
z-index:2;
top:0px;
left:0px;
}


imgJSP.js:
//存放图片
var imgsrc= new Array();
//图片数量
var imgnum=0;
//当前图片位置
var imgnow=0;
//每个浮动层的宽度
var fwidth =0;
//最后一个浮动层的宽度
var restwidth
//时间对象
var time

//示例
imgsrc[0]="img/201201.jpg";
imgsrc[1]="img/201202.jpg";
imgsrc[2]="img/201203.jpg";
imgsrc[3]="img/201204.jpg";
imgsrc[4]="img/201205.jpg";
imgsrc[5]="img/201206.jpg";
imgsrc[6]="img/201207.jpg";

jQuery(document).ready(function(){

//图片预加载
var arr = new Array();
for(var i=0; i<imgsrc.length; i++) {
arr[i] = new Image();
arr[i].src=imgsrc[i];
arr[i].onload;
}

$("#imgImg").attr("src",imgsrc[0]);

//浮动层的宽
iwidth =$("#imgDiv").width();
fwidth=parseInt(iwidth/imgsrc.length);
restwidth = iwidth-fwidth*(imgsrc.length-1);

//添加div浮动层
for(var i=0; i<imgsrc.length; i++) {
if(i<imgsrc.length-1){
html="<div id='img"+i+"' style='position:absolute; width:"+fwidth+"px; height:100%;top:0;  left:"+fwidth*i+"px;opacity:0; z-index:3'></div>"; 
}else {
html="<div id='img"+i+"' style='position:absolute; width:"+restwidth+"px; height:100%;top:0;  left:"+fwidth*i+"px;opacity:0; z-index:3'></div>"; 
}
$('#imgDiv').append(html);


if(i<imgsrc.length-1){
html2="<div id='tip"+i+"' style='position:absolute; width:"+fwidth+"px; height:100%;top:0;  left:"+fwidth*i+"px; border-left-width:1px;border-left-style: solid;border-left-color: #0CF;z-index:3'></div>"; 
}else{
widthThis =restwidth-1;
html2="<div id='tip"+i+"' style='position:absolute; width:"+widthThis+"px; height:100%;top:0;  left:"+fwidth*i+"px; border-left-width:1px;border-left-style: solid;border-left-color: #0CF;border-right-width:1px;border-right-style: solid;border-right-color: #0CF;z-index:3'></div>"; 
}
$('#tipDiv').append(html2);


}


$('#tipDiv').css("background-color","#9FF");
$('#tip0').css("background-color","yellow");

相关资料更多>

  1. 用注释的代码就出错？原理不是一样的么？解决方法
  2. jsp与js的访问,该怎么解决
  3. 这段代码究竟有什么有关问题
  4. 正则表达式判断是不是是一个java方法
  5. IO源中最常见的while循环
  6. 远程协助的程序如何写啊
  7. 大过年的，多撒些分，参与就有分，呵，请问一个有点怪的有关问题。
  8. 怎么通过字符串来生成Date类型的对象
  9. JSP学习技术群解决方法