Question

我的目标：页面加载时在defalt选项卡中有一个img。用户单击img并逐渐淡出以激活下面的选项卡。

我的问题：在我的html页面中，我放置了一个img标签。在标题中有一个javascript，它在点击时成功淡化了img。但是当img放在“标签”区域的内容部分时，当我加载页面时，淡入淡出会触发。我确定这两个脚本之间存在冲突。我的淡入淡出脚本（在html页面上）和运行“Tabs”的外部javascript。

旁注：我已经做了无数次安排将img标签放在html标签布局中。和css一起工作。

感谢任何建议。

<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="utf-8" />

<title>page</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<link rel="stylesheet" href="CSS/style13.css" type="text/css" media="screen" /> 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> 

<script src="Js/tabs.js" type="text/javascript"></script>

<link rel=stylesheet type="text/css" href="tabstyle.css" /><script>

$(document).click(function(){
   $("img").fadeOut('slow', function() {
       $("img").removeClass();
      });
});
</script>

</head>
<body>

<div class="WRAPPER">

<img src="images/tvOff.jpg" width="760" height="523">

<p class="dropcontent">

<div id="cyclelinks"></div>
</p>

<p class="dropcontent">
<img src="images/tvOn.jpg" width="760" height="523">
</p>

<p class="dropcontent">
<img src="images/logo1.png" >
</p>

</div><!--WRAPPER CLOSE-->`enter code here`
<div class="tvBase"></div>


</body>
</html>

Answer 1

您将click放在整个文档上，而不只是图像上。您也会淡化所有图像，而不仅仅是单击的图像。

$("img").click(function(){
   $(this).fadeOut('slow', function() {
       $(this).removeClass();
   });
});

javascript在加载时触发而不是单击

1 个答案: