Overwrite arrow to return to top on videos, images, etc

Asked

Viewed 31 times

1

I’m not getting over the arrow to get back to the top that is fixed on my page.

Always when it goes through images, videos and some applications that use Javascript it disappears.

I would like to know if there is any specific solution.

Use the following code to use the arrow

<a class="botaotopo scroll" href="#banner" title="Para o topo !">
    <img src="images/to-top.png" border="0" />
</a>

And the CSS of the class the other is :

.botaotopo {
  display:scroll;
  position:fixed;
  bottom:2px;
  right:2px;
}

And the JS:

(function($){$.fn.UItoTop=function(options){var defaults={text:'To Top',min:200,inDelay:600,outDelay:400,containerID:'toTop',containerHoverID:'toTopHover',scrollSpeed:1200,easingType:'linear'},settings=$.extend(defaults,options),containerIDhash='#'+settings.containerID,containerHoverIDHash='#'+settings.containerHoverID;$('body').append('<a href="#" id="'+settings.containerID+'">'+settings.text+'</a>');$(containerIDhash).hide().on('click.UItoTop',function(){$('html, body').animate({scrollTop:0},settings.scrollSpeed,settings.easingType);$('#'+settings.containerHoverID,this).stop().animate({'opacity':0},settings.inDelay,settings.easingType);return false;}).prepend('<span id="'+settings.containerHoverID+'"></span>').hover(function(){$(containerHoverIDHash,this).stop().animate({'opacity':1},600,'linear');},function(){$(containerHoverIDHash,this).stop().animate({'opacity':0},700,'linear');});$(window).scroll(function(){var sd=$(window).scrollTop();if(typeof document.body.style.maxHeight==="undefined"){$(containerIDhash).css({'position':'absolute','top':sd+$(window).height()-50});}
if(sd>settings.min)
$(containerIDhash).fadeIn(settings.inDelay);else
$(containerIDhash).fadeOut(settings.Outdelay);});};})(jQuery);

1 answer

0


Elements with a larger z-index are stacked in front of elements with a smaller z-index

 .botaotopo {
   z-index: 1;
   ..........
   ..........

In your case this will work, it will only seem that there in the footer that is the same color :)

  • Excellent solved my problem, thank you very much!

Browser other questions tagged

You are not signed in. Login or sign up in order to post.