Simonhagstrom

@tuanphan - I added one more image on the work page of my website, and these effects don't seem to apply to the new image. Why is that? Thanks!

No problem! Yes that's correct.

@tuanphan My mobile version looks absolutely horrible and I don't know how to fix it... The footer has a very large height and takes up way too much space. And I can't scroll all the way down (?) (please see attached print screens). I would be so happy if you could have a look at this 🙂 This is all the code I've out into my css: .sqs-gallery-block-grid .slide .margin-wrapper .image-slide-title { display: block } @font-face { font-family: 'NeueHaas'; src: url(https://static1.squarespace.com/static/5e17905e54b69916a2bb2fdc/t/6201767c4b483174027e3018/1644263036925/NHaasGroteskTXPro-55Rg.ttf), url(https://static1.squarespace.com/static/5e17905e54b69916a2bb2fdc/t/62017729ac7c02113052a402/1644263209676/NHaasGroteskTXPro-65Md.ttf), url(https://static1.squarespace.com/static/5e17905e54b69916a2bb2fdc/t/62017774e6ca7137a4c86535/1644263284837/NHaasGroteskTXPro-75Bd.ttf);} .Header-nav--primary .Header-nav-item {font-family:NeueHaas;} .Header-branding { display: none; } h2 { font-family: 'NeueHaas';} .Header { position: fixed; z-index: 9999; width: 100%; top: 0px; } h3 { font-family: 'NeueHaas';} h1 { font-family: 'NeueHaas';} a { border-bottom: none !important; } /* Work page image hover */ @media screen and (min-width:901px) { div#page-5fc5186808845d09242c2ad6 { figcaption.image-card-wrapper { opacity: 0; z-index: 1000000000 !important; } .image-inset:after { content: ""; background-color: rgba(0,0,0,0.5); position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 9999; opacity: 0; } .image-block:hover img { transform: scale(1.2); transition: all 2s; } .image-block img { transition: all 1,5s; } .image-block:hover figcaption { opacity: 1; } .image-block:hover .image-inset:after { opacity: 1; }}} header.Header.Header--top { position: fixed; top: 0; width: 100%; z-index: 999; background: ; } .Parallax-item:first-child { top: 0 !important; } /* mobile */ .Mobile.loaded { position: absolute; top: 0; width: 100%; z-index: 999; background: transparent; } .Mobile-bar.Mobile-bar--top { background: transparent; } .Site-inner { min-height: calc(100vh - 7px); } .footer { height: 10px; } .Footer { position: fixed; bottom: 0; left:0; right: 0; }

@tuanphan Do you see it now?

Yes that's right 🙂

Site URL: https://trumpet-pumpkin-rl4y.squarespace.com/ Hi! I would like to make some changes to my home page. First of all - Is it possible to make the navigation text white only on the homepage? Second - is there any way I can make the footer transparent (only on home page), so that the banner video is behind the footer text? Would be very nice if these changes also will apply to mobile and tablet view. Password: hejhej Thankful for any help 🙂

Thank you very much for the help! I tried it and it worked, but it didn't end up the way I thought. What I would like to try is to have that effect on the homepage, but only on the video.. Thanks again!

Is there any way I can make this apply to all pages? I would like to have it on the home page aswell 🙂 Thanks!

Fantastic! Thank you so much 🙂 It worked perfectly!!

Exactly! So basically like the website I linked to.

Site URL: https://trumpet-pumpkin-rl4y.squarespace.com/work I would like to have the same hover effect on my images (on all pages), as this site: https://www.graphicalhouse.com/work I think it's so nice that the text "pops" up while the image is getting darker with a slight zoom in. Is this possible to do? Thankful for any help 🙂 https://trumpet-pumpkin-rl4y.squarespace.com/work Pass: hejhej

I would like to adjust the H3 font size on mobile view only. Is that possible to do? For all pages. Best, Simon

Thank you so much! it worked fine 🙂 I actually have another question, I hope that's ok with you. I would like to adjust the H3 font size on mobile view only. Is that possible to do? For all pages.

It works now! thanks 🙂

I realized this css code caused another issue now. On mobile and tablet view, I would like the footer to be at the bottom, meaning not visable until I've scrolled down to the end of the page. Is this possible? Thanks!