Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Henrique Foletto

[Resolvido] Jquery 1.7.1 Background Position

Recommended Posts

Olá a Todos, tudo bem?

 

Então, eu estou tentando animar um box ao deslizar o mouse sobre outro, dê uma olhada no script:

window.onload = function (){
var chamada = document.getElementById('chamada');
var box = document.getElementById('box');
chamada.style.backgroundPosition = '-125px 0';
$(function(){
$('box')
	.mouseover(function(){
		$('chamada').animate({'background-position-x':"-125px", 'background-position-y': '0'},200);
	})
	.mouseout(function(){
		$('chamada').animate({'background-position-x':"0", 'background-position-y': '0'},200);
	})
});
}

E no Html assim:

 

<ul id="empreendimentos">
<li id="box"><a href="#"><div id="chamada"></div></a></li>
</ul>

 

Então, é isso, alguém faz ideia de como consertar?

Ps.: Estou usando essa biblioteca: http://code.jquery.com/jquery-1.7.1.js

 

Desde já, Grato. Att,

Henrique Foletto.

Compartilhar este post


Link para o post
Compartilhar em outros sites

O problema é que nem todos os browser implementam backgroung-position-x e y, tente assim:

.mouseover(function(){
                       $('chamada').animate({'background-position':'-125px 0'},200);
               })
               .mouseout(function(){
                       $('chamada').animate({{'background-position':'0 0'},200);
               })

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Opa, Valeu Herique, valeu mesmo, funcionou certinho!

Mas o problema não foi especificamente esse, foi o seguinte, ao remover o Window onload e os "var", indo direto para a função funcionou, depois que eu fui ver no Firebug que dava erro no window onload, então coloquei direto pelo id na função! Dê uma olhada em como ficou o script:

 

$(function(){
$('#chamada')
	.css( {backgroundPosition: "-190px 15px"} )
	.mouseover(function(){
		$('#chamada').animate({'background-position':'0 15px'},300);
	})
	.mouseout(function(){
		$('#chamada').animate({'background-position':'-190px 15px'},300);
	})
});

 

Muito Obrigado pela ajuda!

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.