• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
Locked
0

Rollover/scroll effects mobile site

Explorer ,
Feb 14, 2018 Feb 14, 2018

Copy link to clipboard

Copied

Hi there,

I'm building a mobile site on adobe muse at the moment. I am trying to recreate this type of hover/scroll effect as seen on this mobile site https://www.emertumilty.com/ (it's a rollover on desktop and some type of scroll effect on mobile)

I am specifically referring to how the picture turns to text as you continue to scroll on the homepage on a phone. I realise this is not a Muse site.

Does anyone know how I would achieve this?

Thank you

Views

1.5K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Guide , Feb 14, 2018 Feb 14, 2018

There are no scrolling effects. When you look on the phone - it's just a glitch because it works hover effect from touching your fingers.

This can be done from the state button and a text frame with a background fill inside it. In the standard state, the text frame has 0% opacity, in the hover state 100% opacity. That's all there is to it.

Votes

Translate

Translate
Guide ,
Feb 14, 2018 Feb 14, 2018

Copy link to clipboard

Copied

There are no scrolling effects. When you look on the phone - it's just a glitch because it works hover effect from touching your fingers.

This can be done from the state button and a text frame with a background fill inside it. In the standard state, the text frame has 0% opacity, in the hover state 100% opacity. That's all there is to it.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Feb 15, 2018 Feb 15, 2018

Copy link to clipboard

Copied

Thank you!

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Feb 15, 2018 Feb 15, 2018

Copy link to clipboard

Copied

In addition to Pavel Homeriki​:

Have a close look at this .muse sample file and preview it in browser. It demonstrates, how these effects are created:

https://www.dropbox.com/s/fdlm9g9lrrbjmui/interactive-triggers.muse?dl=0

https://www.dropbox.com/s/fdlm9g9lrrbjmui/interactive-triggers.muse?dl=0If you can’t find out, how it is made – please ask!

(As Pavel already stated: Hover effects aren’t possible on touch devices, because they don’t know a hover state.)

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Mar 14, 2018 Mar 14, 2018

Copy link to clipboard

Copied

LATEST

I was looking for someone to help explain how mobile states compare to desktop states & your response has helped! 

Few q's: Based on previewing the provided mobile site above, it looks like the hover state is when a person touches the image but doesn't actually tap it.  Is hover the same as rollover?

Are these behaviors accurate?

     Normal - scrolling through with no touch to image

     Rollover - scrolling with touch to image

     Mouse Down - tapping

     Active - *What does active look like on a mobile?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines