1

查询代码

$(document).ready(function(){

$('#about').css("opacity","0");
$('#decoy').css("opacity","0");
$('#clickabout').css("opacity","0.2");
$('#clickdecoy').css("opacity","0.2");

function clickhq(){

   $('#clickhq').css("opacity","1");
    $('#clickabout').css("opacity","0.2");
    $('#clickdecoy').css("opacity","0.2");
    $('#hq').animate({opacity:"1"},2000);
    $('#about').animate({opacity:"0"},1000);
    $('#decoy').animate({opacity:"0"},1000);
}

function clickabout(){

    $('#clickhq').css("opacity","0.2");
    $('#clickabout').css("opacity","1");
    $('#clickdecoy').css("opacity","0.2");
    $('#hq').animate({opacity:"0"},1000);
    $('#about').animate({opacity:"1"},2000);
    $('#decoy').animate({opacity:"0"},1000);
}

function clickdecoy(){

    $('#clickhq').css("opacity","0.2");
    $('#clickabout').css("opacity","0.2");
    $('#clickdecoy').css("opacity","1");
    $('#hq').animate({opacity:"0"},1000);
    $('#about').animate({opacity:"0"},1000);
    $('#decoy').animate({opacity:"1"},2000);

}

$("#clickhq").on('click',clickhq);

$("#clickabout").on('click',clickabout);

$("#clickdecoy").on('click',clickdecoy);

});

代码

<div id="content">

<div id="activityicons">
<img id="clickhq" src="images/hq.png" width="139" height="139" />
<img id="clickabout" src="images/out.png" width="139" height="139" />
<img id="clickdecoy" src="images/decoy.png" width="139" height="139" />
</div>

<div id="activityiconstext">

<div id="hq">
</div>

<div id="about">
</div>

<div id="decoy">
</div>

</div>

</div>

基本上，当用户点击三个图像之一时，jquery 应该淡入/淡出相关内容。这在 jsfiddle、IE 和 firefox 中运行良好，但在 chrome 和 safari 中却不行。

可以在此处查看实时链接：http ://www.alexkearns.co.uk/35norwich/scouts/index.php

4

3 回答 3

0

你是正确的，你的 img 可以在http://www.alexkearns.co.uk/35norwich/scouts/index.php被点击一次。

但是您提供的 html 和 js 代码会响应 chrome、firefox 和 IE 中的点击事件。

那么，我们如何重现这个问题呢？

于 2013-07-30T23:06:31.487 回答
0

更改 jquery url 的来源

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>

至

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
于 2013-07-30T23:28:43.660 回答
0

我通过使用涉及 PHP 的解决方法来修复它，并且仅在设置了特定 GET 变量时才显示内容

于 2013-07-31T09:53:47.033 回答