Jquery没有完成整个字符串

时间:2012-01-20 23:34:04

标签: jquery

基本上我正在创建一个简单的翻转功能。滚动一个部分,它会显示更多信息。除了我想在用户点击类“关闭”的div时关闭open div时,一切正常。我有一系列事情需要发生,但由于某种原因,只有一个是开火。这是我的HTML示例:

<div id="container">
<div id="truck"><img src="eVie.png" width="637" height="280" alt="Evie" /></div>
<div class="marker a">
<div class="content a inactive"><img src="solarpanel.jpg" width="240" height="205" alt="Solar Panels" /><div class="close"></div>
  <h2>Solar Panels</h2>
  <p>Here Comes The Sun: These solar panels capture light and heat from the sun to power exhibits when I’m out visiting around town.</p>
</div>
</div>
<div class="marker b">
<div class="content b inactive"><img src="tailpipe.jpg" width="240" height="205" alt="Tailpipe Area" />
  <h2>Tailpipe Area</h2>
  <p>No tailpipe, no fumes. That’s how I roll.</p>
</div>
</div>
<div class="marker c">
<div class="content c inactive"><img src="plug.jpg" width="240" height="205" alt="Plug" />
  <h2>Plug</h2>
  <p>Not An Ordinary Plug: Big trucks need more energy. To get all the energy I need, I have to have a bigger plug and a special outlet!</p>
</div>
</div>
</div>

你可以在.content.a上看到我有这样的关闭div:

<div class="close"></div>

这是我的jQuery:

$(document).ready(function(){

$(".marker").hover(
function(){
$(this).children(".content.inactive").addClass("show");  
$(this).children(".content.inactive").animate({width: 155}, "fast");     
 }
 ,
 function(){
$(this).children(".content.inactive").animate({width: 5, height: 23}, "fast");
$(this).children(".content.inactive").removeClass("show");       
 }
 );
 $(".content").click(
function(){
$(this).removeClass("inactive");
$(this).addClass("active");  
$(this).animate({width: 435, height: 205}, "fast"); 
$(".inactive").addClass("disabled");
$(".disabled").removeClass("inactive"); 
$(".disabled").parent().addClass("dim");
$("#truck img").addClass("dim");
  }
  );
  $(".content.active").click(
  function(){
  $(".content").animate({width: 5, height: 23}, "fast");
  $(".disabled").addClass("inactive");
$(".inactive").removeClass("disabled"); 
$(".inactive").parent().removeClass("dim");
$("#truck img").removeClass("dim"); 
$(".active").addClass("inactive");
$(".show").removeClass("show");
$(".active").removeClass("active"); 
  });
  $(".content").click(function(){ return false; });
  $(document).on("click", function() { $(".content").animate({width: 5, height: 23}, "fast");

$(".disabled").addClass("inactive");
$(".inactive").removeClass("disabled"); 
$(".inactive").parent().removeClass("dim");
$("#truck img").removeClass("dim"); 
$(".active").addClass("inactive");
$(".show").removeClass("show");
$(".active").removeClass("active"); 
   });

   $(".close").click(
   function(){ 
$(".show").removeClass("show");
$(".content.disabled").parent().removeClass("dim");
    $(".inactive").parent().removeClass("dim");
$("#truck img").removeClass("dim"); 
$(".active").addClass("inactive");
$(".show").removeClass("show");
$(".active").removeClass("active");
   });

   });

最后一部分是我在点击.close时尝试执行字符串的地方。但是,无论我放在那里,只有removeClass(“show”)触发。

以下是我到目前为止的内容:http://stlenergy.org/evie/

HELP!我假设我的代码中有其他东西干扰了这个命令,但我无法弄明白。在此先感谢您的帮助!

0 个答案:

没有答案