2016-04-24 8 views
0

WhatsAppのようなコメントボックスを貼り付けた固定フッターを私たちのウェブサイトに追加できますか?同じページにコメントを表示する。そうする方法はありますか?ここでWhatsAppのようなコメントボックス付きの固定フッター

は私のHTMLコードをここで

<!DOCTYPE html> <html lang="en-US"> 

<head>  <link rel="stylesheet" href="main.css" type="text/css" /> 
    <title>ChatRoom</title>  </head> 

<body>  <div id="navigation">  <a href="#">test</a> </div> 


    </body> 
</html> 

である私のサイトのCSSが

body { 
    padding: 0; 
    margin: 0; 
    font-family: Lucida Grande, Helvetica, Arial, sans-serif; 
    font-size: 12px; 
} 

#navigation { 
    position: fixed; 
    top: 0; 
    width: 100%; 
    color: #ffffff; 
    height: 10%; 
    text-align: center; 
    padding-top: 15px; 
    /* Adds shadow to the bottom of the bar */ 
    -webkit-box-shadow: 0px 0px 8px 0px #000000; 
    -moz-box-shadow: 0px 0px 8px 0px #000000; 
    box-shadow: 0px 0px 8px 0px #000000; 
    /* Adds the transparent background */ 
    background-color: rgba(60, 179, 113, 1.0); 
    color: rgba(60, 179, 113, 1.0); 
} 

#navigation a { 
    font-size: 40px; 
    padding-left: 15px; 
    padding-right: 15px; 
    color: white; 
    text-decoration: none; 
} 

#content { 
    width: 600px; 
    padding-top: 70px; 
    padding-bottom: 30px; 
    margin-left: auto; 
    margin-right: auto; 
} 

#content img { 
    padding-top: 20px; 
    padding-bottom: 30px; 
} 

で誰もがそれで私を助けてくださいことはできますか?

答えて

0

いいえ、それだけであれば、そうすることはできません。

タスクを実行するにはサーバーロジックが必要です。

1

はい、あなたはそれを行うことができます。スティッキーフッターの場合は、フッターがコンテナに対してボトムにくるようにフッタabsoluteを配置し、bottom:0を実行します。また、コメントを操作するためのJavascriptロジックを記述する必要があります。

この例では、大まかにJSFiddleの実装があります。ご不明な点がございましたらお尋ねください。お役に立てれば!

関連する問題