Thu, 18 Mar 2010 18:33:27 +0000
Some adjustments to lay out the conversation UI page
<html> <head> <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script> <script type="text/javascript" src="js/strophe.js"></script> <script type="text/javascript" src="js/xmpp_muc.js"></script> <script type="text/javascript" src="js/supportchat.js"></script> <style type="text/css"> #support-chat { display:none; } #support-converse, #support-question, #support-converse-input, #support-question-type, #support-question-text { width:100%; } #support-send-button, #support-question-submit { float:right; } #support-wait, #support-converse { display:none; } #support-log { position:relative; top:0px; overflow: auto; height:90%; padding:5px; } #support-input { height:7%; bottom:0px; position:relative; } </style> </head> <body> <div id="support-chat"> <div id="support-question"> <h2>What is the nature of your question?</h2> <select id="support-question-type"> <option>Sales</option> <option>Technical</option> </select> <h2>What is your name?</h2> <input id="support-question-name" type="text" /> <h2>Your question:</h2> <textarea id="support-question-text"></textarea><br/> <input id="support-question-submit" type="submit" /> </div> <div id="support-wait">Please wait...</div> <div id="support-converse"> <div id="support-log">Hello</div> <input id="support-input" type="text" value="Hello" /> <input id="support-send-button" type="submit" value="Send" /> </div> </div> </body> </html>