<html> <head> <title>b</title> <mce:style><!-- body{ margin: 0px; padding: 0px; } #main{ border: solid red 1px; width: 800px; height: 600px; font-size: 48px; position: absolute; } .little{ height: 5px; width: 5px; font-size: 1px; border: solid #ccc 1px; position: absolute; left: 100px; top: 100px; } .big{ height: 20px; width: 20px; font-size: 8px; border: solid #ccc 1px; position: absolute; left: 100px; top: 100px; } --></mce:style><style mce_bogus="1"> body{ margin: 0px; padding: 0px; } #main{ border: solid red 1px; width: 800px; height: 600px; font-size: 48px; position: absolute; } .little{ height: 5px; width: 5px; font-size: 1px; border: solid #ccc 1px; position: absolute; left: 100px; top: 100px; } .big{ height: 20px; width: 20px; font-size: 8px; border: solid #ccc 1px; position: absolute; left: 100px; top: 100px; } </style> </head> <body> <div id="main"> <div class="little"></div> </div> </body> </html> <mce:script type="text/javascript"><!-- var doc = document; function $(id){return doc.getElementById(id)}; var container = $('main'); function Bubble(left, top, color, score){ var ele = doc.createElement('div'); ele.className = 'little'; ele.style.left = left + 'px'; ele.style.top = top + 'px'; ele.style.backgroundColor = color; this.element = ele; this.score = score; container.appendChild(ele); } Bubble.prototype = { move: function(){ var _self = this; alert(_self.element.className) var _f = function(){ status =(_self.element.className); _self.element.style.left = parseInt(this.element.style.left) + 1; _self.element.style.top = parseInt(this.element.style.top) + 1; } setInterval(function(){ _f.apply(_self); }, 100) } } function createBubble(){ var COLORS = ['red','orange','lightyellow','green','blue','purple']; var left = Math.floor(Math.random()*795); var top = Math.floor(Math.random()*595); status = 'left: ' + left + " top: " + top; var colorIndex = Math.floor(Math.random()*6); var score = Math.floor(Math.random()*500); var b = new Bubble(left, top, COLORS[colorIndex], score); return b; } createBubble().move(); // --></mce:script>
如对本文有疑问，请提交到交流论坛，广大热心网友会为你解答！！ 点击进入论坛
