March for the Heart is an annual giving challenge hosted by Academy of the Sacred Heart in St. Charles, Missouri, which invites alumni, families, and friends to pledge donations and spread the word.
Visit the demo site: willyates.org/march
The site features a marquee of donor names in the header, which uses JavaScript and CSS to pull names from a WordPress post, then format each name into the marquee. This was done so it was easy for users to update a simple post, which would then automatically update the marquee in the header. A lot of work went into figuring out the specifics of the infinite scroll, such as having to duplicate the marquee items to create a seamless infinite scroll effect. The end result was very smooth, but I have to admit that I found the process quite funny when compared to the deprecated HTML <marquee> tag which basically does the same thing for 0 effort, albeit at a lower framerate and with a few of its own issues 🙂
The site also features additional JavaScript for the donation bar, which needed to be manually manipulatable due donations from multiple sources and pledges.
Visit the live site: ash1818.org/march
Visit the demo site: willyates.org/march