Tip: you can modify some code before running
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title></title></head><style>#list{ width:420px; height:380px; border:1px solid #666; padding:5px;}#list ul{ list-style:none; float:left;}#list li{ margin:5px;}#list img{ width:100px; vertical-align:middle; border:0;}#list div.box{ width:130px; height:150px; border:1px solid #333; display: table-cell; vertical-align:middle; text-align:center; display: block; font-size: 130px; position:relative; overflow:hidden;}#list div.tip{ height:25px; line-height:25px; text-align:center; width:130px; background:#999; position:absolute; z-index:10; top:120px; font-size:14px; filter:alpha(opacity=40); -moz-opacity:0.4;}</style><body><div id="list" name="list"><ul> <li><div class="box"></div></li> <li><div class="box"></div></li></ul><ul> <li><div class="box"></div></li> <li><div class="box"></div></li></ul></div><script language="javascript">Var list = document. getElementById ("list"); var divs = list. getElementsByTagName ("div"); var t; for (var I = 0; I <divs. length; I ++) {divs [I]. onmouseover = function (e) {var tip = document. createElement ("div"); var img = this. getElementsByTagName ("img"); tip. innerHTML = img [0]. getAttribute ("alt"); var event = event | window. event; tip. setAttribute ("class", "tip"); tip. setAttribute ("className", "tip"); tip. style. left = "-100px"; this. appendChild (tip); t = setInterval (function () {showtip (tip) ;}, 10) ;}divs [I]. onmouseout = function (e) {clearInterval (t); var tip = this. lastChild; if (tip. tagName = "DIV") {this. removeChild (tip) ;}} function showtip (obj) {var left = gs (obj, "left"); var value = left + 10; if (value <= 0) {obj. style. left = value + "px";} else clearInterval (t);} function gs (obj, a) {if (obj. currentStyle) {var curVal = obj. currentStyle [a]} else {var curVal = document. defaultView. getComputedStyle (obj, null) [a]} return parseInt (curVal );}</script></body></html><br /></td> </tr></table>
Tip: you can modify some code before running
