php如何鼠标移到图片链接显示缩略图?
RT
<a href="xxxxxxxxxx" target="_blank">zzzz</a>
要求鼠标移到图片链接显示缩略图
[解决办法]
跟php没关系
[解决办法]
<!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><script type="text/javascript">window.onload = function() { var links = document.getElementById('demo').getElementsByTagName('a'); for( var i = 0; i < links.length; i ++) { links[i].onmouseover = function() { var url = this.getAttribute('thumb'); var img = document.createElement('img'); img.src = url; img.style.position = 'absolute'; img.style.top = this.offsetTop; document.getElementById('demo').appendChild(img); } links[i].onmouseout = function() { var img = document.getElementById('demo').getElementsByTagName('img')[0]; img.parentNode.removeChild(img); } }}</script></head><body><div id="demo" style="position:relative;"><a href="#" target="_blank" thumb='http://img3.cache.netease.com/www/logo/logo_png.png'>163.com</a><br /><a href="#" target="_blank" thumb='http://www.google.com.hk/intl/zh-CN/images/logo_cn.png'>Google.com</a></div></body></html>
[解决办法]
<!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><script type="text/javascript">window.onload = function() { var links = document.getElementById('demo').getElementsByTagName('a'); for( var i = 0; i < links.length; i ++) { links[i].onmouseover = function() { var url = this.getAttribute('thumb'); var img = document.createElement('img'); img.src = url; img.setAttribute('width','50px'); img.setAttribute('height','50px'); img.style.position = 'absolute'; img.style.top = this.offsetTop; document.getElementById('demo').appendChild(img); } links[i].onmouseout = function() { var img = document.getElementById('demo').getElementsByTagName('img')[0]; img.parentNode.removeChild(img); } }}</script></head><body><div id="demo" style="position:relative;"><a href="#" target="_blank" thumb='http://img3.cache.netease.com/www/logo/logo_png.png'>163.com</a><br /><a href="#" target="_blank" thumb='http://www.google.com.hk/intl/zh-CN/images/logo_cn.png'>Google.com</a></div></body></html>