Loading...
 

Back To Top (version 0.4.3)

Back To Top installs and assigns a module featuring a "back to top" arrow.

Screenshots



Known Issues & Limitations


Fixed Issues

[+]

Installation & Update

To add this Profile repository to your Tiki add the line below to your Admin (Control Panels) → "Profiles" → "Advanced" tab → "Repository URLs" text area:
https://profiles.luciash.eu/profiles

If you do an update please do not forget to unassign the previous version in Modules, otherwise you will end up with multiple modules applied.
From your TikiAdmin homeProfiles admin panel by hitting the Apply Now button (or Forget and Re-apply to update) the following YAML code will be applied:

YAML
objects:
 -
  type: module
  data:
   name: Back To Top 0.4.3
   position: bottom
   order: 1
   params:
    nobox: y
   custom: |
    <style type="text/css">{literal}
    .backtotop {
        bottom: 3rem;
        position: fixed;
        right: 3rem;
        z-index: 1;
    }
    .backtotop a:after {
        border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgba(255, 255, 255, 0.5);
        border-style: none solid solid;
        border-width: 0 1rem 1.5rem;
        content: "";
        display: block;
        left: 0.5rem;
        position: absolute;
        top: 0.6rem;
    }
    .backtotop a {
        background: none repeat scroll 0 0 rgba(0, 0, 0, 0.25);
        border-radius: 12.8rem !important;
        color: rgba(255, 255, 255, 0.5);
        display: block;
        font-size: 400%;
        height: 3rem;
        line-height: 58%;
        margin-right: 0;
        overflow: hidden;
        position: relative;
        text-align: center;
        text-decoration: none;
        text-indent: -999rem;
        width: 3rem;
    }
    .backtotop a:active, .backtotop a:focus {
        outline: none;
    }
    {/literal}</style>{jq}{literal}
    $('.backtotop').hide();
    function backtotop(){
        var scrolled = $(window).scrollTop();
        if (scrolled > 0) {
            $('.backtotop').fadeIn();
        } else {
            $('.backtotop').fadeOut().removeAttr('style');
        }
    }
    $(window).scroll(function(e){
        backtotop();
    });
    $('.backtotop a').click(function(event){
        event.preventDefault();
        $('html,body').animate({
            scrollTop:$('body').offset().top
        }, 1000);
    });
    {/literal}{/jq}<div class="backtotop"><a href="#top" title="Back To Top">⌅</a></div>


Usage

This profile creates a custom module with a link "Back To Top" of the page. It will put the jQuery Smarty block code in it which is contained within the profile's "custom:" part in the YAML code to the module body. The module will be assigned to the bottom zone.
A triangle pointing up in a semi transparent circle should appear near the bottom right edge of the viewport. Clicking it will scroll the page back to top if you scrolled down a bit.

Uninstall

Just un-assign and delete the module on the Admin → Modules page.