Ir para conteúdo

POWERED BY:

Arquivado

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

Good

[Resolvido] Movimentos dentro de div

Recommended Posts

Estou querndo fazer um sistema parecido com o google maps. Só quem sem usar.. o conteúdo da div vai estar carregado e só é necessário fazer os movimentos.

 

Vejam a imagem:

movu.png

 

 

Quero fazer com que a div que está com a borda em vermelho, se movimente de acordo com o usuário que passar o mouse nas suas extremidades.

 

É parecido com um iframe, só que não quero aquelas barras de rolagem. Apenas quando passar o mouse perto das extremidades ir movimentando o conteúdo da div.

 

<div>
   <div style="float: left; width: 250px; height: auto;">
       <div style="background: url('url da imagem') no-repeat center; width: 240px; height: 150px;">
       texto
       </div>
   </div>
   <div style="clear: both"></div>
</div>

 

 

OBS: Me recomendaram um tal de drag and drop, sei lá.. umas funções com esse nome, só que eram totalmente diferente..

 

 

Espero que tenham entendido e me ajudem!

 

obrigado.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Já que ninguém me ajudou.. pelo menos nem postou dizendo que não sabia.. Eu não deveria postar também..

 

Depois de um tempão, eu achei. E o código seria:

 

<style>
#parallax
   {position:relative; overflow:hidden; width:400px; height:400px;}
</style>

<script type="text/javascript" src="http://webdev.stephband.info/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="http://webdev.stephband.info/jparallax/js/jquery.jparallax.js"></script>

<script type="text/javascript">
 jQuery(document).ready(function(){
 	jQuery('#parallax').jparallax({}).append('');
 });
</script>

 <div id="parallax" class="clear">
 	<div style="width:874px; height:501px;">
 		<img src="URL IMAGEM"/>
 	</div>
 </div>

 

 

MAIS INFORMAÇÕES: http://webdev.stephband.info/jparallax/index.html

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.