[Mervyn]

Hi Everybody, I am new to this, so please forgive me if this is a silly question. I am just trying to build a website to share my holiday adventures in Italy. I use a full screen photo in my header, so I need to let my readers know that there’s more to see below the photo. Bravada shows a fading scrolldown arrow, but I think its not clear enough. I would like the arrow to be more clear for everyone. Is there a way to do that? Draw a square around the arrow, or make it bolder, or…I would appreciate the help, thanks in advance!

Website: www.italieroadtrips.nl

[Mervyn]

Hello everyone, I still hope that somebody can help me with my question about the scrolldown arrow.Right now I’m afraid that I’ve managed to lose (!) the scrolldown arrow completely, so I probably did something wrong but I really don’t know what…Help please…?

[Zed]

Hi,

Could you include a link to your site?

---

If you like our creations, help us share by rating them on WordPress.org.
Please check the available documentation and search the forums before starting a topic.

[Mervyn]

Hi Zed, thanks for responding, my website is http://www.italieroadtrips.nl

[Mervyn]

Hi Zed, I found this (underneath) and it brought back my arrow! Still a little vague though,in my opinion. But is this the right way to repair the arrow? If yes, I am still looking for a way to make the arrow more clear. Can you help me with that? I hope to hear from you soon!

.btn-down:active, .btn-down:focus, .btn-down {
text-align: center;
cursor: pointer;
color: #fff;
font-size: 40px;
position: absolute;
bottom: 80px;
}

[Mervyn]

Hi Joyce, I think you’re supposed to start a new thread for your question?

[Mervyn]

Nobody here who can help me? Very disappointing….

[Zed]

Sorry about the odd replies, spam still manages to creep through.

Try adjusting the scroll indicator arrow to white:

#header-image-main .meta-arrow i {
    color: white;
}

If that is insufficient, perhaps speeding up the animation would help:

body .meta-arrow > i::before {
    -webkit-animation: meta-arrow 1.2s ease-out infinite;
    animation: meta-arrow 1.2s ease-out infinite;
}

---

If you like our creations, help us share by rating them on WordPress.org.
Please check the available documentation and search the forums before starting a topic.

[Mervyn]

Thank you very much Zed!! I used both options and it really works fine!

Website: www.italieroadtrips.nl

[GoodThing]

Hi Zed,
Hi Mervyn,

I’m very interested by the above suggestions. Like Mervyn, I would like indicate to visitors that page is scrollable.

Could you please indicate to me where/HowTo implement these changes ?

Kind regards,

Etienne

Website: www.lesindecis.be

• This reply was modified 4 years ago by GoodThing.

[GoodThing]

OK, I found. Simply in additional CSS.

Thank you.

Regards,

Etienne

[Author]

Posts