hackyoupeople
@hackyoupeople

Как сделать что бы нижний блок уменьшался при вводе в textarea а не двигался в низ?

Как зафиксировать блок что бы при вводе в textarea он уменьшался а не двигался в низ?
<!DOCTYPE html>
<html>
<head>
    <meta charset='UTF-8' />
    <style type="text/css">
        <!--
        .mess {
            margin-left: auto;
            width: 262px;
        }
        .footer {
            height: 40px;
            background: #791912;
            margin-left: auto;
        }
        .radio {
            width: 262px;
            margin-left: auto;
            height: 80px;
            background: #111111;
        }
        .room-table {
            width: 1024px;
            height: 600px;
            background-image: url("img/_bg3.jpg");
        }
        .chat_wrapper {
            width: 262px;
            height: 480px;



            margin-bottom: 100px;

            margin-left: auto;
            background: #111111;
            font: 14px 'lucida grande',tahoma,verdana,arial,sans-serif;
            color: #FCFCFC;
            opacity: 0.7;
        }
        .chat_wrapper .message_box {
            background: #111111;
            margin-bottom: 100px;
            top: 200px;

            width: 242px;
            height: 395px;
            overflow: auto;
            padding: 10px;
            word-break: break-all;

        }
        .chat_wrapper .panel input{
            padding: 2px 2px 2px 5px;
        }
        .system_msg{color: #BDBDBD;font-style: italic;}
        .user_name{font-weight:bold;}
        .user_message{color: #88B6E0;}
        -->
    </style>
</head>
<body>
<?php
$colours = array('007AFF','FF7000','FF7000','15E25F','CFC700','CFC700','CF1100','CF00BE','F00');
$user_colour = array_rand($colours);
?>

<script src="js/jquery.min.js"></script>

<script language="javascript" type="text/javascript">
    $(document).ready(function(){

        var wsUri = "ws://localhost:9000/server.php";
        websocket = new WebSocket(wsUri);

        websocket.onopen = function(ev) {
            $('#message_box').append("<div class=\"system_msg\"></div>");
        }

        $('#message').keydown(function(e){
            if(e.keyCode === 13) {
                var mymessage = $('#message').val();
                var myname = $('#name').val();


                if (myname == "") {
                    console.log("Нет Имени");
                    return;
                }
                if (mymessage == "") {
                    console.log("Пустое собщение");
                    return;
                }


                var msg = {
                    message: mymessage,
                    name: myname,
                    color: '<?php echo $colours[$user_colour]; ?>'
                };

                websocket.send(JSON.stringify(msg));
            }
        });


        websocket.onmessage = function(ev) {
            var msg = JSON.parse(ev.data);
            var type = msg.type;
            var umsg = msg.message;
            var uname = msg.name;
            var ucolor = msg.color;

            if(type == 'usermsg')
            {
                $('#message_box').append("<div><span class=\"user_name\" style=\"color:#"+ucolor+"\">"+uname+"</span> , <span class=\"user_message\">"+umsg+"</span></div>");
            }


            $('#message').val('');
        };

        websocket.onerror   = function(ev){$('#message_box').append("<div class=\"system_error\">Ошибка</div>");};
        websocket.onclose   = function(ev){$('#message_box').append("<div class=\"system_msg\">Закрыто</div>");};
    });
</script>
<div class="room-table" >
    <div class="footer"></div>
    <div class="radio"></div>
    <textarea class="mess" type="text" name="message" id="message" placeholder="Введите сюда сообщение и нажмите Enter" maxlength="320" style="background: #111111; color: #FCFCFC;border: none; overflow: hidden; box-sizing: border-box; display: block; "></textarea>
<div class="chat_wrapper">


    <div class="message_box" id="message_box"></div>
    
</div>
</div>
</body>
</html>
  • Вопрос задан
  • 30 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через TM ID
Похожие вопросы
Spartan.by Минск
от 400 до 700 usd.
Alternativa Games Пермь
от 40 000 до 80 000 руб.
АМТ Екатеринбург
от 40 000 до 50 000 руб.
16 янв. 2019, в 14:53
20000 руб./за проект
16 янв. 2019, в 14:52
3000 руб./за проект
16 янв. 2019, в 14:11
5000 руб./за проект