there is

<div class='open_some_block'> Открить <ul> <li>один</li> <li>два</li> </ul> </div> <div>Что то еще</div>

When you click on open_some_block list should open. How to do this with the help of transform: translateY so that this dropdown list moves the second block to the bottom?

PS I know how to do this with heigth , here's an example http://jsfiddle.net/50gsLtL2/12/ . But this option does not suit me

  • jsfiddle.net/soledar10/bztbby67 - soledar10
  • Unfortunately, transform does not change the markup, so it will not work to move other elements to them. - Rolandius
  • jsfiddle.net/soledar10/p6gf6jsj - soledar10
  • You can see this my answer - maybe some ideas will come. PS Well, and study the question there yourself in order to understand what we were trying to do. - Roman Grinyov
  • Do not think for advertising, but maybe it will help. On YouTube, I saw an example with such a moving list, in search, enter CSS / CSS3 Tutorials. Part 19. Animation (animation) is like what you need. - Bleser

1 answer 1

How about this option?

 $(document).ready(function() { $('#opentext').click(function() { $('#text').slideToggle() }); }); 
 #text { display: none; } 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div id="opentext">Показать текст полностью</div> <div id="text"> <p>Текст текст текст текст</p> <p>Текст текст текст текст</p> <p>Текст текст текст текст</p> <p>Текст текст текст текст</p> </div> <div>второй блок</div>

  • 2
    They asked for the same css. With the script, and so everywhere is full of examples. - Qwertiy ♦