■I want to make the header be more transparent. ※ I use Shopify
New here? Learn about Bountify and follow @bountify to get notified of new bounties! x

I want to make the header be more transparent. ※ I use Shopify
Opacity : 0.1 or 0.2

※I use the same template of this ' http://themes.shopify.com/themes/seasons/styles/spring '.

※Please refer attached photo ' https://www.dropbox.com/s/7dysd6oz05dndly/%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202013-10-05%208.05.46.png '.

I will send you an invitation mail to edit this codes on shopify.
Could you edit the codes?

I am posting 8 requests.
I'm happy if you check other requests.

I'm under the impression you're not using Bountify correctly...
alixaxel almost 6 years ago
awarded to tomtoump

Crowdsource coding tasks.

3 Solutions


Just add it to the CSS?

#Header {
  opacity: 0.8;
}

It's not gonna work as opacity is controlled by javascript function

please gave me the access so I could change that
ochi almost 6 years ago
Using !important overrides the value set by javascript.
tomtoump almost 6 years ago
if You use !important than header will be always opaque - it will look strange... and change required for that to work is easy and controlled in script
ochi almost 6 years ago
You were right, just fixed that. I always prefer the css solutions over js.
tomtoump almost 6 years ago

Open the "Template Editor" and locate your theme's css file. You have to add the following rules:

#Header.scrolled{
    opacity: 0.8 !important;
}

I could add it directly to your shopify if you want.

View Timeline