Question

这是我目前正在做的事情。

PHP回显了数据库中最近发布的用户名：

echo '<div id="userblock">test</div>';
echo '<span class="userpost">' . $str . ' - posted by <b>' . $username . '</b></span><br /><br />';

然后我希望拥有它，当测试悬停在您看到用户个人资料/统计信息/信息直接显示在帖子的左侧。

到目前为止，这是我对CSS所拥有的内容，而且我不会塑造或擅长造型。所以我很乐意接受你的意见。

div#userblock {
display:none;
}

span.userpost:hover  div#userblock {
    background-color:#efefef;
    height:150px;
    width:150px;
}

Answer 1

因为#userblock必须嵌套在.userpost。

中

像...这样的东西。

echo '<span class="userpost"> <div id="userblock".. />  </span>';

然后使用以下CSS：

#userblock {

    display:none;
}

.userpost:hover  #userblock {

    display:block;
}

Answer 2

以下是使用jquery：http://jsfiddle.net/surendraVsingh/sT66P/1/

执行此操作的方法

Jquery代码：

$('.userpost').hover(function(){
    $(this).prev("#userblock").show();
    //$(this).prev("#userblock").toggle(); //if you want to toggle show/hide of div//
});

CSS代码

#userblock {
 background:#999;
 display:none;
}

.userpost{
    background-color:#efefef;
    height:150px;
    width:150px;
}

将鼠标悬停在<span>上并显示<div>？</div> </span>

2 个答案: