-
Conteúdo Similar
-
Por 4Unknow
Fala galerinha beleza, bom vamos lá.
Eu tenho um site que o conteúdo dele é tudo em uma página só, o menu, quando escolho uma opção ele leva em uma determinada parte do site referente ao menu clicado. Até aqui ok.
Porém eu instalei um botão para voltar para o topo quando rola o site para baixo, e como sou leigo em Java, notei que parece que tá tendo conflito com o ScrollTop, pois o botão que coloquei para voltar para o topo também tem o scrolltop. Gostaria de fazer funcionar o menu e o botão juntos, pois quando desativo o .js do botão o menu funciona normal, quando ativo o botão novamente ele para de funcionar.
Vou deixar o código de ambos aqui.
.JS do Menu (scroll.min.js)
(function(e){"use strict";var t="ScrollIt",n="1.0.3";var r={upKey:38,downKey:40,easing:"linear",scrollTime:600,activeClass:"active",onPageChange:null,topOffset:0};e.scrollIt=function(t){var n=e.extend(r,t),i=0,s=e("[data-scroll-index]:last").attr("data-scroll-index");var o=function(t){if(t<0||t>s)return;var r=e("[data-scroll-index="+t+"]").offset().top+n.topOffset+1;e("html,body").animate({scrollTop:r,easing:n.easing},n.scrollTime)};var u=function(t){var n=e(t.target).closest("[data-scroll-nav]").attr("data-scroll-nav")||e(t.target).closest("[data-scroll-goto]").attr("data-scroll-goto");o(parseInt(n))};var a=function(t){var r=t.which;if(e("html,body").is(":animated")&&(r==n.upKey||r==n.downKey)){return false}if(r==n.upKey&&i>0){o(parseInt(i)-1);return false}else if(r==n.downKey&&i<s){o(parseInt(i)+1);return false}return true};var f=function(t){if(n.onPageChange&&t&&i!=t)n.onPageChange(t);i=t;e("[data-scroll-nav]").removeClass(n.activeClass);e("[data-scroll-nav="+t+"]").addClass(n.activeClass)};var l=function(){var t=e(window).scrollTop();var r=e("[data-scroll-index]").filter(function(r,i){return t>=e(i).offset().top+n.topOffset&&t<e(i).offset().top+n.topOffset+e(i).outerHeight()});var i=r.first().attr("data-scroll-index");f(i)};e(window).on("scroll",l).scroll();e(window).on("keydown",a);e("body").on("click","[data-scroll-nav], [data-scroll-goto]",function(e){e.preventDefault();u(e)})}})(jQuery)
.JS do Botão Back to top (backtotop.js)
jQuery(window).scroll(function(){ if(jQuery(window).scrollTop()<50){ jQuery('#rocketmeluncur').slideUp(500); }else{ jQuery('#rocketmeluncur').slideDown(500); } var ftrocketmeluncur = jQuery("#ft")[0] ? jQuery("#ft")[0] : jQuery(document.body)[0]; var scrolltoprocketmeluncur = $('rocketmeluncur'); var viewPortHeightrocketmeluncur = parseInt(document.documentElement.clientHeight); var scrollHeightrocketmeluncur = parseInt(document.body.getBoundingClientRect().top); var basewrocketmeluncur = parseInt(ftrocketmeluncur.clientWidth); var swrocketmeluncur = scrolltoprocketmeluncur.clientWidth; if (basewrocketmeluncur < 1000) { var leftrocketmeluncur = parseInt(fetchOffset(ftrocketmeluncur)['left']); leftrocketmeluncur = leftrocketmeluncur < swrocketmeluncur ? leftrocketmeluncur * 2 - swrocketmeluncur : leftrocketmeluncur; scrolltoprocketmeluncur.style.left = ( basewrocketmeluncur + leftrocketmeluncur ) + 'px'; } else { scrolltoprocketmeluncur.style.left = 'auto'; scrolltoprocketmeluncur.style.right = '10px'; } }) jQuery('#rocketmeluncur').click(function(){ jQuery("html, body").animate({ scrollTop: '0px',display:'none'},{ duration: 600, easing: 'linear' }); var self = this; this.className += ' '+"launchrocket"; setTimeout(function(){ self.className = 'showrocket'; },800) });
Ficaria inteiramente grato se alguém pudesse me ajudar nessa.
Um forte abraço a toda comunidade.
-
Por snkGOD
Olá!
Como sou novo na área e estou aprendendo, gostaria que alguém me ajudasse com o problema de posicionar DIV's. Como podem ver na imagem, o número 1 a posicão do fundo_menu não está tomando toda tela, sobra um espaço ali no canto, no numero 2 é possível ver que pode-se arrastar a barra para lateral. Isso é um dos problemas, mas o que mais está me incomodando é a questão de número 3, pois não consigo posicionar uma DIV (fundo_denuncia) ali no canto, no quadrado azul, tento posicionar, mas ela sempre passa e aumenta ainda mais a área da página, como também podem ver no numero 2. Gostaria de saber como faço para posicionar essa div(fundo_denuncia) ali no canto direito e como faço pra preencher aquele espaço sobrando no numero 1 e que esse fundo_menu não aumente o tamanho da página.
Segue o código que fiz:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>BABACAS NEWS</title>
</head>
<style>
body{
background-color: #161616;
}
#fundo_denuncia{
margin: 0;
padding: 0;
background-color: #172240;
position: absolute;
width: 150px;
height: 40px;
top: 55px;
left: 100%;
z-index: 2;
}
#fundo_menu{
background-color: #DF3F41;
position: absolute;
margin: 0px;
padding: 0px;
width: 100%;
height: 40px;
top: 55px;
opacity: 0.90;
}
#logo{
margin: 0;
padding: 0;
position: absolute;
top: 5px;
left: 50px;
}
#menu ul{
position: absolute;
padding: 10px 10px 10px 10px;
list-style: none;
display: block;
float: left;
}
#menu li{
float: left;
position: relative;
left: 400px;
top: 6px;
padding: 0px 50px 0px 0px;
}
#menu li a{
font-family: "Arvo";
color:aliceblue;
text-decoration: none;
}
#menu li a:hover{
color: #172240;
transition: 0.5s;
}
</style>
<body>
<div id="fundo_denuncia"> </div>
<div id="fundo_menu"> </div>
<div id="logo"><a><img src="images/logo site.png"></a></div>
<div id="menu">
<ul>
<li><a href="#">Início</a></li>
<li><a href="#">História</a></li>
<li><a href="#">Notícias</a></li>
<li><a href="#">Ranking</a></li>
<li><a href="#">MT</a></li>
<li><a href="#">SxC</a></li>
<li><a href="#">Inscrições</a></li>
</ul>
</div>
</body>
</html>
-
Por bruno_mlo
Pessoal to com um site aqui com erro, isso ta atrapalhando outros scripts... Tem o seguinte erro no debug do firefox: $(...).offset(...) is undefined... alguem pode me ajudar????????? vou mandar o trecho do código q da erro
$(document).ready(function(){
$(window).scroll(function() {
clearTimeout($.data(this, 'scrollTimer2'));
$.data(this, 'scrollTimer2', setTimeout(function() {
var eTop2 = $('section.servicos .banner.personalizado .release').offset().top; //get the offset top of the element
if(eTop2 - ($(window).scrollTop()+$(window).height()) < 0) {
$('section.servicos .banner.personalizado .release').addClass("animated bounceIn visibility");
}
}, 0));
});
});
-
Por Alessandro Bodão
Boa tarde pessoal. Eu estou fazendo um site com o cabeçalho fixo, que ocupa tola a tela inicialmente, e quero que o resto da página fique a baixo e suba por cima do cabeçalho fixo, mas não sei como deixar o resto da página exatamente em baixo da tela, com o margin-top so fica certo na resolução do meu monitor, e com o bottom não funciona. Gostaria que me ajudassem. Obrigado.
-