How to position a div side by side with JS / jQuery

Question

How to position a div side by side with JS / jQuery

Navigation

#1 by (1 votes)
#2 by (0 votes)

0

I'm creating a simple chat system where you have a function that opens the user window to which you want to chat face style. What I would like to know is how when opening the second user the window gets lined up next to the first window and not above that is what is happening. This is the code at the moment.

<script>
$(document).ready(function () {
    $('.chat').die('click').live("click", function () {
        var chat = $(this).attr("rel");
        var URL = 'chat.php';
        var dataString = 'chat=' + chat;

        $.ajax({
            type: "POST",
            url: URL,
            data: dataString,
            cache: false,
            success: function (html) {
                $("body").append("<div id='main" + chat + "'></div>")
                $("#main" + chat).html(html);
            }
        });
        return false;
    });
});
</script>

CSS

<style>
#chatbox {
  position: absolute;
  bottom: 0px;
  width: 200px;
  height: 300px;
  z-index: 4;
  background-color: #ECECEC;
  border: 1px solid #000;

}
</style>

HTML

<a  class="chat"  rel="8" href="#">user A </a>
<br/>
<a  class="chat"  rel="7" href="#">user b </a>

javascript jquery css

asked by anonymous 08.07.2014 / 20:37

2 answers

Jquery does not return the minimum value when using Math.min () Error reading% f and% e of a file in C

score 1 · Answer 1

You can create an ul and setar display as inline and absolute position and with jquery go adding items (chat windows which can be a div) in that list.

$("#ul_id").append("<li><div id='chat_" + chat_id + "'></div></li>");

score 0 · Answer 2

Suppose you want to align the chat windows to the right so you have to also assign the value of the right attribute in CSS via JQuery. Assign ascending values in amount of 205px because the width of your "window" is 200px;