無法使WebSite正常工作。如何組裝這段代碼？

-3

http://jsfiddle.net/GxuqQ/無法使WebSite正常工作。如何組裝這段代碼？

如果您點擊上面的鏈接，您會看到我想要創建的示例。但是現在我試圖採用這個例子。但它不起作用。

我創建了一個HTML文檔，一個CSS文檔和一個JavaScript文檔。我將示例中的代碼複製到正確的文檔中。一切都應該工作。但事實並非如此。

我在做什麼錯？

氣泡不起作用。它只是不顯示。

來源

2012-08-31 Leo George

提ID「一切都應該工作。但事實並非如此。」。你需要解釋什麼沒有在具體工作。 –

究竟是行不通的？你怎麼知道這是「正確的文件」，在這種情況下，「正確/正確」意味着什麼？「它不起作用。」是不是問題 - 因此是downvotes。 – feeela

因此，您向我們展示了一些可以工作的代碼，您已經以某種非特定的方式更改了該代碼，並且您希望我們能夠說明爲什麼您的未指定更改已破壞它？ – Quentin

就像我說的，你必須把它放在你的HTML下面包含您在JavaScript

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Test</title> 
<style> 
.pw-hint{ 
    display:none; 
    position: absolute; 
    border: 1px solid #999; 
    -webkit-border-radius: 5px; 
    background-color:#EEE; 
    color:black; 
    max-width:300px; 
    font-size: 14px; 
    padding:5px; 
    margin-top:22px; 
} 

.pw-hint:after { 
    /*http://css-tricks.com/speech-bubble-arrows-that-inherit-parent-color/*/ 
    content: ""; 
    position: absolute; 
    top: -20px; 
    left: 10px; 
    border-bottom: 20px solid black; 
    border-bottom-color: #EEE; 
    border-left: 20px solid transparent; 
    border-right: 20px solid transparent; 
} 

.pw-hint h2{ 
    font-size:20px; 
    color:#D31515; 
} 
</style>  
</head> 
<body> 

<a href="#" id="link">click here</a> 
<div class='pw-hint' id="hint"><h2>Warning!</h2> Lorem ipsum bla bla</div> 
<script> 
    document.getElementById("link").addEventListener("click", clicked); 
     function clicked(){ 
     document.getElementById("hint").style.display = "block"; 
     } 
</script> 
</body> 
</html>

來源

2012-08-31 19:17:47 Christina

無法使WebSite正常工作。如何組裝這段代碼？

回答

相關問題