SlideDown issue when height is auto
Hi guys,
I got to show correctly the content of my div (description). when i click
"Readmore" i show all the content, otherwise, i show only 40px of height.
i tried to make the view beauty by adding a slideDown and SlideUp but that's not working.
Can someone help me please ? thanks.
this is my code :
- $(document).ready(function($) {
-
- var expanded = 0;
- $(".description .readmore").on("click", function() {
- if(expanded == 0) {
- $(this).siblings(".showhalf").css("height", "auto");
- $(".readmore").text();
- expanded = 1;
- } else {
- $(this).siblings(".showhalf").css("height", "40");
- $(".readmore").text()
- expanded = 0;
- }
- });
- });
-
- <div class="description">
- <p class="showhalf">
- Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repellat, eaque, facilis dicta totam vel rem iure officia quisquam magnam nulla deleniti iusto inventore doloremque quia ipsum saepe esse amet hic.
- Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repellat, eaque, facilis dicta totam vel rem iure officia quisquam magnam nulla deleniti iusto inventore doloremque quia ipsum saepe esse amet hic.
- </p>
- <a href="javascript:;" class="readmore">read more ... </a>
- </div>