标签:
A:首先,请看效果图 Demo
需要注意的是,这种效果是用absolute属性,而不是float属性,从这个Demo中又一次认识到absolute属性的强大。貌似需要注意的只有这一点。
A:代码块
window.onload = function(){ var oPanel = document.getElementsByClassName(‘container‘); for(var i=0;i<64;i++){ oPanel[0].innerHTML += "<div style=‘width:50px;height:50px;position:absolute;top:" + parseInt(i/8)*51 + "px;left:"+ 51*(i%8) + "px;background:url(images/01.jpg)"+ " no-repeat " + -51*(i%8) + "px " + -51*parseInt(i/8) + "px;opacity:0;filter:alpha(opacity:0)‘" + "></div>"; } var oDiv = oPanel[0].getElementsByTagName(‘div‘); for(var i=0;i<oDiv.length;i++){ oDiv[i].onmouseover = function(){ this.style.opacity = 1; this.style.filter = ‘alpha(opacity:‘ + 100 + ‘)‘; } } }
JS实现自动生成li,产生每10个换行,颜色变换,正V,倒V效果图
标签:
原文地址:http://www.cnblogs.com/zhaolina/p/5548137.html