效果图如下：
js代码如下：
var ul = document.getElementById("box");
var li = "";
for(var i=0;i<128;i++){
li += "<li style='background-position:0 "+ (i-128) +"px;'> </li>";
}
ul.innerHTML = li;
运行下面的代码，查看js倒影效果的实现：
提示：您可以先修改部分代码再运行
纯js图片倒影代码
纯js写的兼容IE6的图片倒影效果。其实，就是在图片的下面加个ul，在ul中加入高度为1，宽度和图片一样宽的li，li里面用js循环，背景为图片，只不过每次只显示1像素的高，再用背景定位，第一个li，就显示图片最底下的1像素，第二个li显示图片从底部开始的第2像素的内容，以此类推，最后一个li显示图片最顶部的1像素高的内容，也就是图片有多高，就有多少个li，用js循环很好实现，最后用js将循环的li加入ul。
效果图如下：
js代码如下：
效果图如下：
js代码如下：