0

我想做的是:

在我的网站中,我想在左角有一个 div,当鼠标不在它上面时,它只是一个带有颜色的简单正方形(现在)。

为此,我有这个代码:

<div id='bot'>
</div>

当然,它非常简单,在我的 CSS 中:

#bot{
  position: fixed !important;
  bottom: 40px !important;
  width:50px;
  height:150px;
  left:0%;
  border:1px solid black;
  box-shadow:1px 1px 1px;
}

#bot:hover{
  width:500px;
}

好的,现在就可以了。现在,当我 MOUSEOVERIT 时,我想出现在这个 div 上,它会显示一个 iframe:

<iframe name='botframe' src='http://demo.vhost.pandorabots.com/pandora/talk?botid=a431414a6e34774c' frameborder='0' scrolling='no'></iframe>

这可能吗?如果是这样,我该怎么办?如果需要,我了解一点 javascript,但对 jQuery 了解不多,所以如果需要 jQuery,请准确告诉我我必须做什么以及将代码放在哪里。

非常感谢你提前

4

2 回答 2

0

不要将 id 用于 div 请将 id 用于 iframe,

<div> <iframe **id='bot'** name='botframe' src='http://demo.vhost.pandorabots.com/pandora/talk?botid=a431414a6e34774c' frameborder='0' scrolling='no'></iframe>
</div>
于 2013-08-21T14:01:08.400 回答
0

将 div 放在 iframe 上,并在悬停时更改每个的 z-index。

<iframe id='botframe' name='botframe' src='http://placehold.it/50/' frameborder='0' scrolling='no'></iframe>
<div id='bot'></div>

#bot{position:fixed; background:pink; bottom:40px; width:50px; height:150px; left:0; border:1px solid black;}
#botframe {position:fixed; background:yellow; bottom:40px; width:50px; height:150px; left:0; border:1px solid red;}
#bot:hover{z-index:-1;}
#botframe:hover{z-index:100;}

http://jsfiddle.net/gcWeC/

于 2013-08-21T14:08:19.070 回答