Форум

Brutto · #1 (**permalink**) 14.07.2013, 19:47

Граждане, есть два дива, спозиционированные через float:left, по нажатию кнопки они должны меняться местами. Не могу понять как это сделать?(( Помогите пожалуйста!

читал статьи, но никак не получается(

рони · #2 (**permalink**) 14.07.2013, 20:34

Brutto,
добавить первый див после второго

Brutto · #3 (**permalink**) 14.07.2013, 21:24

<html>
<head>
<style>
.div1{
float: left;
width: 60px;
height: 100px;}

.div2{
float: left;
width: 60px;
height: 100px;}
</style>

<script type="text/javascript">

</script>
</head>
<body>

<div class="div1"></div>
<div class="div1"></div>

<FORM name=form>

<input class="buttom" type='button' onclick='exchange();' value='Do it!'>

</form>
</div>
</body>
</html>

Вот что у меня получилось, но они меняются местами сверху вниз, а мне нужно слева направо. Как это сделать?

рони · #4 (**permalink**) 14.07.2013, 21:38

для начала пожалуйста найдите <> и отредактируйте своё сообщение поместив код в теги

animhotep · #5 (**permalink**) 15.07.2013, 13:02

тот пример не рабочий, а вобще меняются они http://codepen.io/anon/pen/aCKDe

рони · #6 (**permalink**) 15.07.2013, 13:28

animhotep,

пример можно разместить тут

[HTML run]ваш код[/HTML]

<!DOCTYPE HTML>
<html>
<head>
  <meta charset="utf-8" />
        <style type="text/css">
        div{
           height: 100px;
           width: 100px;
           float: left;
        }
        #one{
           background-color: #FF8C00;
        }
        #two{
           background-color: #FFC0CB;
        }
        </style>
</head>

<body>
   <div id="one">1</div>
   <div id="two">2</div>
   <input id="go" name="" type="button" value="move" onclick="move()">
<script>
 var divs =  document.getElementsByTagName('div');
function move()
{
   divs[0].parentNode.insertBefore(divs[1],divs[0])
}
</script>
</body>
</html>

animhotep · #7 (**permalink**) 15.07.2013, 14:04

спасибо, я в курсе. мне на кодпене удобней

Форум

Справочник

Discord чат

Курсы javascript