Shira Kammen
Client: Shira Kammen
Project Brief:
Ongoing site design and maintenance for a very hands-off client. As an old friend, Shira trusts that I understand her aesthetic and her disinterest in the technical side of things; I keep things running smoothly and occasionally, she updates her performance calendar.
Shira is one of those beloved Bay Area treasures, who has been making music of the antique kind for decades. She specializes in medieval and Renaissance strings, but also plays harps, melodion and other traditional instruments. Her site lets her fans keep abreast of her performances and activities as well as purchase CDs and sheet music. During the pandemic lockdown, Shira created “Noony Tunes” to help her community of musicians connect over shared tunes played simultaneously.
As a side project, Shira has also created “Playing with Phantoms,” with music-minus-one style packages of MP3s for English Country Dance musicians.
3574Note: The placeholder image sizes provided are examples only. You can use images as tall as you like.
To adjust the height of the visible space, edit the max-height value in each section’s structure settings in the advanced tab.
The images are defined in the background settings of the style tab in each section. You need to add the same image to the static and hover states. The static state should have a background position of: Left 50%, Top 0%. The hover state should have a background position of: Left 50%, Top 100%.
You can adjust the speed of the scroll by adjusting the CSS in the Custom CSS box of the parent row.
.bb-scroll-screen-1 .kt-inside-inner-col {
transition: background-position 1s linear;
}
Adjust the 1s value above to control the time the image takes to return to its static state (on mouseout)
.bb-scroll-screen-1 .kt-inside-inner-col:hover {
transition: background-position 10s linear;
}
Adjust the 10s value above to control the speed the image scrolls on hover (on mouseover)