日期:2014-05-16  浏览次数:20343 次

获取点击事件 浏览器不兼容 搞了一下午 egg都疼了 求助好心大侠!
我用mootools做了一个广告图大图伸缩为小图,然后可以点击关闭的效果
网址如下http://www.fanhefan.com/demo/1.html 

点击关闭的时候IE6 7 8都不兼容 火狐 google浏览器都是可以了

水平不够,没有办法调试兼容了

再次求救于各位大侠 谢谢!

代码如下

<html>
<head>
<script type="text/javascript" src="http://www.zhuzhichu.com/statics/script/tools.js"></script>
</head>
<body>
<style>
img{
border:0;
}
.w{
    margin:0 auto;
text-align:center;
}
</style>
<div id="JS_n_header_top_banner" style="height:400px;overflow:hidden;position:relative">
<div id="ff" style="z-index:999;display:none;position:absolute;top:2px;right:2px;background:#c00;width:16px;height:16px;color:#fff;font-weight:bold;text-align:center;line-height:16px;cursor:pointer">×</div>
<div style="background:url(images/1352654628193619199.jpg) top center no-repeat">
<div class="w">
<div id="adBig" style="display:block;">
<a href="" target="_blank"><img src="images/b.jpg"></a>
</div> 
<div id="adSmall" style="display:none;">
<a href="" target="_blank"><img src="images/a.jpg"></a>
</div> 
</div>
</div>
</div>
<script>
function ad() {
var myFx = new Fx.Slide('adBig', {
duration: 2000,
onComplete: function(){
   $('adSmall').setStyle('display','block');
   $('ff').setStyle('display','block');
}
}).slideOut('vertical');
}
window.addEvent('domready',function() {
ad.delay(2000);

});
$('ff').addEvent('click',function(){
$('JS_n_header_top_banner').setStyle('height','0px');
});
</script>
</body>
</html>

------解决方案--------------------
自己用调试工具多试验一下你就知道了
不是事件没有响应,

而是你的IE下$('JS_n_header_top_banner').setStyle('height','0px');这个设置不起作用,详细你自己试一下就可以了

$('JS_n_header_top_banner').setStyle('display','none');要隐藏某个HTML对象请用 display属性。。

还有你这个广告由大逐渐变小的效果并不好,学学新浪的直接一个透明的广告,然后过会自动消失,也可以用户主动关闭。