JQUERY進度條文案愛情

$(function(){
var $progress = $('.progress');
var $percent = $('.percent');
var $text = $('.text');
var $love = $('.love');
$progress.width(0);
$percent.html('0%');
$text.html('我們的故事');
$love.click(function(){
var time = 0;
var intervalID = setInterval(function(){
time++;
if(time <= 100){
$progress.width(time + '%');
$percent.html(time + '%');
}else{
clearInterval(intervalID);
$text.html('我們的愛情已經度過了' + time + '天');
}
}, 50);
});
});

愛情是一種進程，需要不斷努力和經營。JQUERY的進度條文案教我們如何呈現和管理自己的愛情進程。

$progress代表進度條，$percent代表進度百分比，$text代表文案描述，$love代表觸發器button。一開始我們初始設置進度為0，百分比為0%。文案描述為“我們的故事”。

當我們點擊$love時，就會觸發點擊事件。我們設置一個time的計時器，每隔50ms執行一次。當time還小于等于100時，進度條和百分比就會不斷增加，反之就會停止計時器。當計時器停止時，文案描述會顯示“我們的愛情已經度過了xxx天”，xxx就是我們的進度條百分比。

這樣的進度條文案讓我們更形象、更直觀地感受到愛情的進程和時間。同時，也督促我們要珍惜每一天，創造幸福。