將鼠標懸停在wordpress上

Question

因此，我一直在爲懸停時將圖片更改爲另一圖片而苦苦掙扎，但它不會讓步。我使用godaddy上託管的WordPress主題，所以我不習慣代碼。
下面是代碼到位：

<header id="header"> 
    <div id="logo"> 
     <a href="<?php echo home_url(); ?>"> 
      <img src="<?php get_option_tree('rb_logo_path', $theme_options, true); ?>" alt="<?php bloginfo('name'); ?>" /> 
     </a> 
</div> 
<p id="tagline"><?php bloginfo('description'); ?></p> 
</header> 

Answer 1

您需要捕獲了事件的鼠標（例如使用jQuery）和替換圖像。

$('logo').bind('mouseover', function() { 
     $('img').attr("src","<other image url>"); 
    } 

您需要將此代碼添加到您的主題源中。

Answer 2

調整你的HTML這樣的：

<header id="header"> 
    <div id="logo"> 
     <a href="<?php echo home_url(); ?>"> 
      <img class="default-image" src="<?php get_option_tree('rb_logo_path', $theme_options, true); ?>" alt="<?php bloginfo('name'); ?>" /> 
      <img class="hover-only" src="%%OTHER IMAGE URL%%" alt="<?php bloginfo('name'); ?>" /> 
     </a> 
</div> 
<p id="tagline"><?php bloginfo('description'); ?></p> 
</header> 

在你style.css

#logo a img.default-image { 
    display: block; 
} 
#logo a img.hover-only { 
    display: none; 
} 
#logo a:hover img.hover-only { 
    display: block; 
} 
#logo a:hover img.default-image { 
    display: none; 
}