股利是iframe（隱藏和顯示的iframe）

在我的網站，我想在左上角，當鼠標不超過它一個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; 
}

確定，所以現在該做的。現在我想出現在這個div上，當我MOUSEOVERIT，它會顯示一個iframe：

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

這是可能的嗎？如果是這樣，我需要做什麼？如果需要的話，我理解了一點javascript，但沒有太多的jQuery，所以如果需要jQuery，請告訴我我必須做什麼以及在哪裏放置代碼。

非常感謝你提前

來源

2013-08-21 user2703848

而不是使用ID爲DIV請放iframe的ID，

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

來源

2013-08-21 14:01:08

好吧，我會接下來做什麼？編輯：所以我這樣做，我認爲它幾乎完成，唯一的事情是，當鼠標沒有結束時，它仍然顯示一小段iframe中的文本，我希望它不顯示任何內容。我已經嘗試過font-size：0px;但它不會工作 – user2703848

jsut使用帶有id的iframe，它被稱爲'bot'... :) –

是的，我做到了，可以在您的答案中回答我的編輯？ – user2703848

籠罩的iframe的股利，並改變每個懸停的z指數。

<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-21 14:08:19 andi

感謝您的回答，它不正常工作，它是否與你合作，或者你沒有測試它？ – user2703848

那把小提琴適合我。什麼部分不適合你？你看到了什麼？ – andi

當我通過它的鼠標，它似乎是，一個div沒有擴大，另一個做 – user2703848

股利是iframe（隱藏和顯示的iframe）

回答

相關問題