大部分弹窗代码都不敌日趋强悍的浏览器弹窗拦截功能,99%以上都会被拦截。本文介绍的这款弹窗代码颇特别,它通过prototype框架来实现弹窗效果,虽然严格意义来讲不算是弹窗代码,不太完美,但总算能实现弹窗的效果,有需要的不妨试一下。
代码使用:
1. 在<head>区加入以下代码
<script type="text/javascript" src="js/prototype.js"></script> <script type="text/javascript" src="js/scriptaculous.js"></script> <link rel="stylesheet" type="text/css" media="screen" href="css/alessi.css" />
2.在<body>区加入以下代码
<div id="overlay-home"></div> <div class="img-overlay" id="overlay_img"> <a class="close" href="#" onclick="$('overlay_img').hide(); $('overlay-home').hide(); return false;"><span>Close</span></a> <a class="img_over" href="http://www.5icool.org/" title="alessi oggetti e progetti" target="_blank"><span>Alessi</span></a> </div>
如果不需要遮罩效果,请去掉<div id="overlay-home"></div>这句。
3.修改alessi.css文件的类img-overlay,把背景图片修改为自己的图片即可。