Scroll Top Fader

Scroll Top Fader adds a convenient scroll to the top feature to the front-end of your website. It includes a number of really nice configurable features that you can fine tune to your needs. Images auto-size from 30 pixels to 50 pixels depending on the screen size the visitor has to ensure they are not too intrusive. In other words, visitors with larger screens, such as desktop computers would see an image that is 40 to 50 pixels. A visitor using a tablet would see one that is in the 35 to 40 pixels range. A visitor using a mobile phone would see on that is 30 to 35 pixels. All depending on the screen size of the device they happen to be using.

Some of the features include:

• Change the image background color
• Change the image mouse over color
• Option to use transparency
• How far to scroll down a page before it becomes visible
• Specify the Fade In / Fade Out time
• How fast to scroll back to the top of the page
• Set the transition speed from the background color to mouse over color
• Image position/location
• Pick a Border Color
• Pick a Border Hover Color
• Option to disable borders
• 18 Images to choose from
• Optimized images that auto-size/scale (30px, 35px, 40px, 45px, and 50px) depending the screen size
• Configurable shadow effect option

The possibilities are tremendous with the included features.

From within WordPress

1. Visit ‘Plugins > Add New’
2. Search for ‘Scroll Top Fader’ and click to install
3. Activate ScrollTop Fader from your Plugins page.
4. Go to Settings > ScrollTop Fader and configure the options.

You can also download the zip file from this page and upload it from the Plugins >> Add New > Upload page.

Manually

1. Upload the scrolltop-fader folder to the /wp-content/plugins/ directory
2. Activate the ScrollTop Fader plugin through the ‘Plugins’ menu in WordPress
3. Configure the plugin by going to the WordPress Settings menu, then to ScrollTop Fader that appears in your admin menu

Are there any limitations?

Yes, but not many and you will still be able to achieve a really nice effect.

You may hover your mouse over, or tap the ?’s in the plugin settings page, and it will tell you the default values, as well as the limits.

For instance the FadeIn/FadeOut Time has a default value of 1200ms (1.2 seconds), and a maximum of 9999ms (9.999 seconds). The Color Transition Speed has default value of 250ms (1/4 second), and a maximum of 9999ms (9.999 seconds). Both of which are plenty of time to produce a nice effect.

The limits help keep you from entering an invalid number or one that would have no effect.

What if I don’t know color codes?

No problem, just click or tap in the color box and a convenient color picker will appear that will allow you to pick a variety of colors.

1. 

   WordPress Admin Dashboard Settings Page

2. 

   Settings close up

3. 

   Using the Color Picker

4. 

   Admin Help

5. 

   In use on the front-end default color

6. 

   In use on the front-end transparent option

1.1, March 8, 2019

• Now includes more control over shadow effect
• Added additional aarow colors now: black, gray, and white
• Updated plugin settings sanitation
• Added additional security to input fields
• Updated plugin settings – add_settings_section, add_settings_field, and register_settings
• Minify css and js includes both front end and back end now.

1.0.1, March 22, 2017

• Updated Shadow Effect with a Smoother Look and Feel
• Reposition reset defaults message display on plugin settings page
• Changed base default transition time to 250ms
• Improved mobile functionality

1.0.0, February 4, 2017

• First Initial Release