2012-07-25 36 views
0

我想這樣一旦鼠標懸停在圖像的項目名稱實施懸停的JavaScript出現JavaScript鼠標不工作

http://www.dawaf.co.uk/jj/

目前,它似乎顯示項目名稱,而不是它下面的圖像

我錯過了一些重要的東西嗎?

<script type="text/javascript" src="/jj/wp-content/themes/child/scripts/modernizr-2.5.3.min.js"></script> 
<script type="text/javascript" src="/jj/wp-content/themes/child/scripts/plugins.js"></script> 
<script type="text/javascript" src="/jj/wp-content/themes/child/scripts/script.js"></script> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
<script>window.jQuery || document.write('<script src="js/libs/jquery-1.7.1.min.js"><\/script>')</script> 
</head> 

<body> 

    <!--[if lt IE 7]><p class=chromeframe>Your browser is <em>ancient!</em> <a href="http://browsehappy.com/">Upgrade to a different browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">install Google Chrome Frame</a> to experience this site.</p><![endif]--> 

<!-- portfolio-catcher --> 
<div id="portfolio-catcher"> 
</div> 
<!-- .portfolio-catcher --> 

    <header> 
    <!-- container --> 
    <div class="container"> 

     <nav id="local"> 
      <a rel="nofollow" href="#portfolio">Portfolio</a>&nbsp;|&nbsp; 
      <a rel="nofollow" href="#contact">Contact</a> 
     </nav> 

     <h1><a href="#portfolio"><img src="/assets/img/hattie-newman.png" alt="Hattie Newman" /></a></h1> 

     <nav id="external"> 
      <a href="//hattienewman.tumblr.com" target="_blank">News</a>&nbsp;|&nbsp; 
      <a href="//twitter.com/hattienewman" target="_blank">Twitter</a> 
     </nav> 
     <div class="clearfix"></div> 

    </div> 
    <!-- .container --> 

    </header> 
+3

您應該加載在別人面前jQuery腳本 – 2012-07-25 20:06:32

+0

我提出的jQuery所以別人之前加載,但它只是似乎顯示圖像的上半部分,而不是整個事情 – user1096057 2012-07-25 20:08:49

+0

當我訪問您發佈的鏈接時,我在控制檯中得到以下輸出: 'ReferenceError:無法找到變量:jQuery plugins.js:13 ReferenceError:無法找到變量:jQuery script.js: 752' – 2012-07-25 20:09:01

回答

0

<p>標籤存在於<span>height只是每個<li>組內的<hgroup>標記之前被設置爲相同的高度<hgroup>元件。將此<span>的高度設置爲零將顯示下面的<img>。懸停似乎工作正常。如果您想要彩色樣本完全覆蓋圖像,那麼您可以完全刪除<p>

從螢火蟲:

<li data-src="http://www.hattienewman.co.uk/images/uploads/madameproject.jpg" style="height: 393px; position: absolute; top: 0px; left: 652px;" class="masonry-brick"> 
    <p>     
     <span style="width:308px;height:393px;background:#41bba1" class="cover"></span> 
    </p> 
    <hgroup data-project="projects/view/madame-magazine" style="width: 308px; height: 393px; background: none repeat scroll 0% 0% rgb(65, 187, 161); opacity: 0;"> 
     <div> 
      <h3>Editorial</h3> 
      <p>       
       <span class="dash">&mdash;</span> 
      </p> 
      <p>Madame Magazine</p> 
      <p></p> 
     </div> 
    </hgroup> 
    <img alt="xxxxxx" src="http://www.hattienewman.co.uk/images/uploads/madameproject.jpg?Thu Jul 26 2012 01:49:23 GMT+0530 (India Standard Time)"> 
</li>