Jquery аккордеон с анимированной временной шкалой ⇐ Jquery

[Гость]

Я работаю над аккордеоном jQuery с анимированной графикой. Это почти сделано, но я застрял с линией / анимацией на последнем элементе. Вы можете просмотреть рабочий пример на: https://tjobtjob.nl/goldstine-sales-en- ... edewerker/. Пожалуйста, прокрутите вниз к детали, называемой «SollicitatiePocedure», почти внизу. Последний шаг также показывает линию, но я хочу, чтобы эта линия исчезла, так что последний элемент имеет только цветную точку. < /p>

Это мой код jQuery: < /p>

Код: Выделить всё

jQuery.fn.simpleAccordion = function (options){
options = $.extend ({start: 0, activeClass: 'active'}, options || {});

return this.each (
function(){
var $this = $(this);
var headers = $this.children('dt');

headers.next().hide();
headers.eq(options.start).addClass(options.activeClass).next().show();

headers.bind ('click',
function(){
var $this = $(this);

$this.addClass(options.activeClass)
.next().slideDown();

$this.siblings('.' + options.activeClass)
.removeClass(options.activeClass)
.next().slideUp();
}
);
}
);
}
$('dl.stappen').simpleAccordion();
< /code>

И это (s) часть CSS: < /p>

dl.stappen{
width: calc(100% - 45px);
display: inline-block;
margin: 50px 0 0;
padding-left: 45px;
position: relative;

dt{
font-weight: 500;
font-size: 21px;
margin-top: 15px;
margin-bottom: 5px;
cursor: pointer;
position: relative;

&:first-of-type{
margin-top: 0;
}
.round{
position: absolute;
left: -45px;
top: 50%;
transform: translateY(-50%);
width: 12px;
height: 12px;
background: #eee;
border: 3px solid #dcae23;
border-radius: 10px;
z-index: 100;
}
}
dd{
font-size: 17px;
line-height: 26px;
position: relative;

p{
margin-bottom: 15px;

&:last-child{
margin-bottom: 0;
}
}
}
&:before{
background: #dcae23;
height: calc(100% - 24px);
width: 3px;
position: absolute;
content: "";
left: 8px;
top: 8px;
}
}

Спасибо за помощь! Bureaukamp/Pen/Zegoaqa

Подробнее здесь: https://stackoverflow.com/questions/607 ... d-timeline