Wordpress：在悬停时将帖子的标题加载到特定的DIV中答案

【问题标题】：Wordpress: On hover load title of post into a specific DIVWordpress：在悬停时将帖子的标题加载到特定的DIV中
【发布时间】：2014-01-13 23:49:36
【问题描述】：

我目前正在开发一个 wordpress 模板，其中隐藏了帖子的标题，并且在将帖子悬停时，它应该显示在浏览器的底部。为简化起见，帖子的结构如下：

<article class="post">
   <header class="article-header">
      <h2 class="entry-title">
         Post Title
      </h2>
   </header>
   <section class="entry-content">
      Post Content
   </section>
</article>

基本上，我想在正文中有一个固定的，它位于浏览器的底部，当一个帖子悬停时，它的子元素的内容被传递到 .到目前为止，我的方法是让所有元素不断地固定在浏览器底部（隐藏），并且在悬停时，它们中的每一个都会被显示。这导致了一些问题，我认为我可能会更容易拥有一个空 div，它只获取标题信息。

谁能帮我解决这个问题，也许是 jQuery 或 php？

谢谢！

【问题讨论】：

标签： php jquery wordpress hover

【解决方案1】：

你的意思是，像这样的东西？ http://jsfiddle.net/rKhqT/5/

HTML：

<article class="post">
   <header class="article-header">
      <h2 class="entry-title">
         Post Title
      </h2>
   </header>
   <section class="entry-content">
      Post Content
   </section>
</article>
<footer></footer>

CSS：

html, body {
    margin: 0;
    height: 100%;
}

.entry-title {
    display: none;
}
footer {
    position: fixed;
    left: 0;
    bottom:0;
    width: 100%;
    height: 30px;
    border: 1px solid black;
}

JS（需要 jQuery）：

$(document).ready(function() {
    $('article.post').mouseover(function() {
        $('footer').text($(this).find('h2').text());
    });
    $('article.post').mouseout(function() {
        $('footer').text('');
    });    
});

【讨论】：