Un scrollto qui reste en display: none

Bonsoir,
J'ai un scrollto qui permet d'aller en haut de page, malheureusement celui-ci ne s'affiche pas.
Pour le voir, je suis obligé de supprimer le display: none.
Voici mes CSS (sans le display: none)

#top{
  font-size: 30px;
  position: fixed;
  right:10%;
  bottom:20px;
  cursor: pointer;
}

Mon HTML

<div class="containerbis">
<div id="top">
<i class="fa fa-angle-double-up"></i>
</div>
</div>

et mon jquery :

function($){
  'use stricte';
  // Variables
  var $winHeight    = $(window).height(),
      $scrollTopBtn = $('#top'),
      $icon         = $('section > div  i');
  // Section Width 
  $('section div').height($winHeight);
  // Resize Window function 
  $(window).resize(function(){
    $('section div').height($winHeight);
      $icon.css('marginTop', $winHeight - $(this).height() / 2 );
    $icon.css('marginLeft', $(window).width() - $(this).width() / 2 );
  });
// Scrolling
  $(window).scroll(function(){
  //  console.log($(this).scrollTop());
    if ( $(this).scrollTop() >= 450 ){
      $scrollTopBtn.fadeIn();
    }else{
      $scrollTopBtn.fadeOut();
    }
  });     
    $scrollTopBtn.click(function(){
      $('html,body').animate({scrollTop: 0},2000);
    });
  // Center icon inside section
    $icon.css('marginTop', $winHeight - $(this).height() / 2 );
    $icon.css('marginLeft', $(window).width() - $(this).width() / 2 );
}(jQuery));

Trouver la solution serait m'enlever une grosse épine du pied
Merci à vous.
Bonne soirée,
P.

Salut,

a écrit :
J'ai un scrollto qui permet d'aller en haut de page, malheureusement celui-ci ne s'affiche pas.
Pour le voir, je suis obligé de supprimer le display: none.

display:none sert à dire que l'élément ne doit pas être afficher, c'est donc logique qu'il ne s'affiche pas

Je ne comprends pas du tout ton problème ou ce que tu cherches à faire

D'autant plus qu'avec deux lignes de html et une image :

<a href="#"><img src="Images/up.png" alt="Retour haut" title="Retour en haut de page" width="48" height="48"></a>

Tu places l'image là où tu veux le bouton de retour haut. Ou tu la mets en position fixed afin qu'elle suive le cheminement de la page.
Ou avec du vanilia JavaScript qui fait apparaître ce bouton progressivement quand on descend sur la page. Il y a de quoi faire, sans aller chercher jquery.

Bonjour Mathieuu et Bongota,
Merci pour vos réponses
Le HTML est en overflow-y: hidden. C'est pour cela que le scrollTop ne s'affiche pas quand je scrolle.
Si je retire le overflow-y: hidden, il s'affiche bien, même en display: none. (enfin, il s'affiche au scroll).
Mais le background n'est plus en cover, il dépasse en hauteur avec le overflow: visible :
https://lecomptearebours.fr/dev/index.html
Ne me demandez pas pourquoi
Je n'ai que des soucis avec ce slider
Pour info, si je retire le

<video autoplay loop muted="" playsinline="">

des vidéos du slider, plus de problème d'overflow (dépassement vertical), plus de problème de scrolltop... tout roule
Merci à vous, bonne journée.