Page 1 of 1

Add scroll up button to webhelp

Posted: Thu Apr 13, 2017 12:04 am
by caval
I notice the oxygenxml.com pages have a button that appears on scroll down. When clicked, the page jumps to the top.

This is a very common feature of modern websites but is missing from the webhelp (as of v19).

Re: Add scroll up button to webhelp

Posted: Fri Apr 14, 2017 3:29 pm
by bogdan_cercelaru
Hello,

To add a button that scrolls the page to the top of the page to the WebHelp Responsive output, use the "webhelp.fragment.after.body" parameter that points to an XML file with the following content:

Code: Select all

<?xml version="1.0" encoding="UTF-8"?>
<div>
    <script>
    <!--
       $(document).ready(function () {
            //Check to see if the window is top if not then display button
            $(window).scroll(function(){
                if ($(this).scrollTop() > 5) {
                    $('#go2top').fadeIn('fast');
                } else {
                    $('#go2top').fadeOut('fast');
                }
            });
       
           //Click event to scroll to top
           $('#go2top').click(function(){
            $('html, body').animate({scrollTop : 0},800);
           
            return false;
           });
        });
    -->
    </script>
   
    <style>
    #go2top {
        padding: 10px;
        text-align: center;
        font-weight: bold;
        color: #fff;
        position: fixed;
        display: none;
        z-index: 999;
        cursor: pointer;
        height: 44px;
        width: 44px;
        border-radius: 0.25em;
        position: fixed;
        bottom: 37px;
        right: 25px;
        border: 1px solid #999999;
        overflow: hidden;
        white-space: nowrap;
        background-color: #444444;
    }
    </style>
   
    <div id="go2top">
        <span class="glyphicon glyphicon-chevron-up"></span>
    </div>
</div>


Regards,
Bogdan

Re: Add scroll up button to webhelp

Posted: Wed Apr 19, 2017 5:33 pm
by caval
This seems like a very good solution. Thanks. Is there any chance that this will be added to some future build as a regular option in webhelp?

Re: Add scroll up button to webhelp

Posted: Thu Apr 20, 2017 10:47 am
by bogdan_cercelaru
Hello,

I've registered this as a feature request in our issue tracking system to be analyzed.

Regards,
Bogdan

Re: Add scroll up button to webhelp

Posted: Tue Apr 25, 2017 3:32 pm
by B-E-N
Just want to add my +1. We've added a "to top" button via CSS at the end of each page, but this solution here is much nicer. Should be a regular option in one of the next Oxygen releases.

Re: Add scroll up button to webhelp

Posted: Tue Apr 25, 2017 3:44 pm
by Costin
Hi B-E-N,

I've added your vote to the feature request.

Regards,
Costin