Анимировать индикатор при нажатии на ссылку

0

Я хочу анимировать индикатор выполнения после нажатия ссылки. Вот HTML:

<a class="link" href="#">Click Me</a>
<br>
<div class="progress">
    <div class="meter meter1"></div>
</div>
<br>
<div class="progress">
    <div class="meter meter2"></div>
</div>

И прилагаемый CSS:

.progress{
        width: 300px;
        height: 20px;
        background: #c4c4c4;
    }

    .meter{
        height: 20px;
        background: #000;
        width: 0%;
    }

Код jQuery, который я написал, выглядит следующим образом:

        $.('.link').click(function(){

        $('.meter1').animate({width:'80%'}, 3000, 'swing');
        $('.meter2').animate({width:'70%'}, 3000, 'swing');

    });

Хотя, если я удалю событие click и просто загружу страницу, анимации будут работать. Как я могу сделать их ожившими после нажатия ссылки?

Теги:

1 ответ

4
Лучший ответ

у вас есть . перед функцией щелчка

$.('.link')

должно быть

$('.link')

JSFIDDLE

  • 2
    Вы избили меня до одной секунды! :(
  • 0
    Какая глупая ошибка ... теперь я узнал о побочных эффектах работы без сна. На самом деле нужно спать. Большое спасибо.
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню