把指针发在图片上面，就出现这么一层文字
求解？
回复讨论(解决方案)
这个就是感应鼠标的图片遮罩动画效果，给你个网上的例子：
感应鼠标的图片遮罩动画效果 html, body, div,ul, li {margin: 0;padding: 0;}div.examples_body {width: 750px;margin: 0px auto;clear: both;overflow: hidden;}.bannerHolder {width: 726px;margin: 20px 0 15px 0;padding: 20px 10px 20px 10px;background-color: #f7f7f7;border: 1px solid #eee;overflow: hidden;-moz-border-radius:12px;-webkit-border-radius:12px;border-radius:12px;}.bannerHolder li {list-style: none;display: inline;}.banner {position: relative;width: 125px;height: 100px;overflow: hidden;float: left;display: inline;margin: 0 10px}.banner img {display: block;border: none;}.banner div {position: absolute;z-index: 100;background-color: #222;width: 60px;height: 60px;cursor: pointer;-moz-border-radius:100px;-webkit-border-radius:100px;border-radius:100px;}.banner .cornerTL {left:-63px;top:-63px;}.banner .cornerTR {right:-63px;top:-63px;}.banner .cornerBL {left:-63px;bottom:-63px;}.banner .cornerBR {right:-63px;bottom:-63px;}.banner p {display: none;left: 0;top: 57px;width: 100%;z-index: 200;position: absolute;font-family: Tahoma, Arial, Helvetica, sans-serif;color: #FFF;font-size: 11px;text-align: center;cursor: pointer;} $(document).ready(function(){$('.banner div').css('opacity',0.4);$('.banner').hover(function(){var el = $(this);el.find('div').stop().animate({width:200,height:200},'slow',function(){el.find('p').fadeIn('fast');});},function(){var el = $(this);el.find('p').stop(true,true).hide();el.find('div').stop().animate({width:60,height:60},'fast');}).click(function(){window.open($(this).find('a').attr('href'));});});
Visit The Best Designs
查看更多关于图片上的这种效果怎么实现？_html/css_WEB-ITnose的详细内容...
声明：本文来自网络，不代表【好得很程序员自学网】立场，转载请注明出处：http://haodehen.cn/did102987