问题描述:

I have three headers that are inline-block div’s using slideToggle.

(this is one example of the three divs)

<div class="nav">

<div class="links">Portfolio</div>

<div class="descriptions"> this is an example </div>

</div>

If I click on one of the headers it will display the info beneath it. What I’m looking for is for none of the headers to move when one is clicked. Please view my website to see my example. http://mast.salemstate.edu/itc18244/Portfolio/index2.html Any help would be appreciated!

网友答案:

After looking at your site I believe I have a solution. The problem with your site is flow of elements when they are being rendered. When on of your divs that are being toggled visible they need X amount of room due to the flow of the page. Therefore, moving the other elements on the page. You need to take the toggled divs out of the normal rendering flow. I achieved this by setting their position to absolute then doing some math to give them a relative position. Check out this fiddle: http://jsfiddle.net/0fm3b3pa/

相关阅读:
Top