Down Home Music Store
Client: Down Home Music Store
Project Brief: Build a webstore that’s clean and easy to navigate, lets users search by genres and categories, showcases new and exciting releases, and is easy for the (very) non-technical staff to update, manage, and track inventory. Down Home Music is the Little Record Store That Could! It’s got one of the best selections anywhere of Roots music from all over the world, but they needed to be able to sell to their fans outside of the area who aren’t able to make it into the shop in Northern California. A Woocommerce shop selling LPs, CDs, DVDs, t-shirts and hats keeps the Down Home music community supplied with their favorite music and apparel. The shop is a magnet for international music lovers who find rare musical gems for their collections. The site features a great Instagram feed of event photos and posters, and the News feed keeps customers updated on regular shop events.
3652Note: 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)