Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Поменять толщину бордюра (https://javascript.ru/forum/misc/23463-pomenyat-tolshhinu-bordyura.html)

bazilio2010 24.11.2011 14:45

Поменять толщину бордюра
 
Нужно чтоб пользователь менял толщину и цвет бордюра при вводе данных в форму почему то не получается с толщиной цвет меняется, а толщина нет.
вот код
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
  <title></title>
     <script type="text/javascript">

    //////////////////border color
    function  bordC () {
    var bodrerBody = document.getElementById('body_content');
    var bc = document.getElementById('bord_color').value;
    bodrerBody.style.borderColor = bc;
    }
        //////////////////border thickness
    function  bordT () {
    var bodrerBody = document.getElementById('body_content');
    var bt = document.getElementById('bord_thickness').value;
    bodrerBody.style.border = bt;
    }


    </script>
</head>

<body>
<form method="post" action="" style="border: 1px solid #111; width: 400px;">
бордюр цвет <input id="bord_color" type="text" name="border" onkeyup="bordC()" /> <br />
бордюр толщина<input id="bord_thickness" type="text" name="border" onkeyup="bordT()"  /> <br />
</form>
<div id="body_content"  style="margin-top: 200px; width: 300px; height: 100px;  border: 3px solid #111;"></div>
</body>

</html>

nikita.mmf 24.11.2011 14:50

потому что толщина должна задаваться в какаих нинубудь единица(px, pt, em, %, ...)

bazilio2010 24.11.2011 14:56

bodrerBody.style.border = bt+'px';
не выходит просто пропадает и все ...(

bazilio2010 24.11.2011 15:01

сделал если кому то понадобится вот
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
  <title></title>
     <script type="text/javascript">

    //////////////////border color
    function  bordC () {
    var bodrerBody = document.getElementById('body_content');
    var bc = document.getElementById('bord_color').value;
    bodrerBody.style.borderColor = bc;
    }
        //////////////////border thickness
    function  bordT () {
    var bodrerBody = document.getElementById('body_content');
    var bc = document.getElementById('bord_color').value;
    var bt = document.getElementById('bord_thickness').value;
    bodrerBody.style.border = bt+'px solid'+bc;
    }


    </script>
</head>

<body>
<form method="post" action="" style="border: 1px solid #111; width: 400px;">
бордюр цвет <input id="bord_color" type="text" name="border" onkeyup="bordC()" /> <br />
бордюр толщина<input id="bord_thickness" type="text" name="border" onkeyup="bordT()"  /> <br />
</form>
<div id="body_content"  style="margin-top: 200px; width: 300px; height: 100px;  border: 3px solid #111;"></div>
</body>

</html>

ksa 24.11.2011 15:44

Цитата:

Сообщение от bazilio2010
bodrerBody.style.border = bt+'px';
не выходит просто пропадает и все ...(

За "толщину" отвечают другие свойства ЦСС
http://htmlbook.ru/css/border-width и другие...

Свойство border используется для "краткой записи"... ;)


Часовой пояс GMT +3, время: 04:28.